در مقالات گذشته به معرفی و بررسی زبان های طراحی صفحات وب مانند: HTML و CSS پرداختیم و نکات مهم، ویژگی ها و معایب و مزایا هرکدام را برای شما بیان کردیم دراین مطلب قصد داریم تا با زبان CSS3 آشنا شویم و به بیان چیستی وتمامیت آن بپردازیم. زبان CSS در سال 1999 آخرین نسخه خودش را یعنی CSS3 را عرضه کرد ، پس اگر قصد دارید همه چیز را در رابطه با موضوع CSS3 چیست؟ کاربرد CSS3 در صفحات وب بدانید در این مقاله با ما همراه شوید. همچنین پیشنهاد میکنیم در رابطه با این موضوع مقالات CSS چیست؟ آشنایی با زبان سی اس اس و Tailwind CSS چیست ؟ همه چیز درباره تیلویند سی اس اس را مطالعه کنید.

CSS3 چیست؟ کاربرد CSS3 در صفحات وب

در واقع CSS3 نسخه سوم CSS است. CSS1 اولین نسخه این زبان بود که فقط ویژگی های خاصی مانند نوع فونت، تراز متن و…  را به همراه داشت، نسخه CSS2 نیز دومین نسخه این زبان بود که ویژگی های نسخه اول را بهبود بخشید. ما در این قسمت سعی داریم CSS3 را به صورت کامل برایتان توضیح دهیم و کاربرد و ویژگی های آن را برایتان شرح دهیم. با ما همراه باشید.

سی اس اس 3 (CSS3) چیست؟

همانطور که قبل تر گفته شد CSS3 نسخه نهایی زبان CSS است که بسیار پیشرفته تر از نسخه های قبلی آن است. سی اس اس 3 به دلیل ویژگی هایی که دارد باعث آسان تر شدن کدنویسی می‌شود و به همین دلیل در کنار زبان HTML5 استفاده می‌شود. در واقع CSS3، علاوه بر ویژگی های CSS، چند ویژگی کاربردی دیگر نیز به همراه دارد.

CSS3 چیست؟ کاربرد CSS3 در صفحات وب

تاریخچه CSS3 

همانطور که قبل تر گفته شد CSS3، نسخه نهایی CSS می‌باشد که در سال 1999 یعنی یکسال بعد از تولید نسخه CSS2، توسط W3C ارائه داده شد. CSS3 مجموعه ای از انواع فونت ها را دارد و شما می‌توانید از هر نوع فونتی استفاده کنید و به دلیل تقسیم شدن به ماژول های زیاد، کار با آن آسان شده است و باعث صرفه جویی در زمان می‌شود، به طوری که بیشتر شرکت ها از سی اس اس 3 و HTML5 برای توسعه وب سایت خود استفاده می‌کنند. آخرین نسخه CSS تقریبا بیشتر امکانات را دارد و به همین دلیل طرفداران زیادی پیدا کرده است.

ویژگی های CSS3

1.سلکتورهای پیشرفته و جدید: selector به طور کلی به معنای فراخوانی می‌باشد که ویژگی های آن امکان دسترسی و انتخاب کدهای HTML را در CSS و برعکس، را برای برنامه نویس فراهم می‌کند. 

2.پشتیبانی از مد های رنگی جدید: فرمت های رنگی، مدل های زیادی مانند RGBA ،HEX ،HSLA ،HSL ،RGB را دارد. هرکدام از این فرمت ها، از ترکیب چند رنگ ساخته شده است که کاربرد هرکدام از آنها با هم متفاوت است. 

3. سایه اجسام (box shadow): این ویژگی CSS3 به برنامه نویس این امکان  را می‌دهد که با تعیین مقادیر مناسب، اجسام را 3 بعدی، سایه دار و برجسته کند. فقط کافی است برنامه نویس کد box-shadow را بنویسد تا این ویژگی ها روی اجسام اعمال شوند. 

4.گوشه های گرد (border radius): این ویژگی باعث گرد شدن گوشه های عناصر در صفحات وب می‌شود. قبل از به وجود آمدن زبان CSS3، برنامه نویس باید کدهای مختلفی می‌نوشت تا به این ویژگی دست پیدا کند. 

5.سایه متن (text shadow): علاوه بر سایه برای اجسام، می‌توانید به متن هم سایه دهید و آن را 3 بعدی کنید. 

6.گرادینت (gradient): در واقع گرادینت، افکتی است که رنگ را به رنگ دیگر تبدیل می‌کند و باعث بوجود آمدن یک افکت زیبا می‌شود. 

7.ساخت اشکال مختلف: با CSS3 می‌توانیم اشکال مختلفی بسازیم. برای مثال می‌توانیم به راحتی مربع ، مستطیل، دایره، بیضی، ماه، ستاره و… را بسازید.  

 

کاربرد های CSS3 

در واقع CSS3 کاربردهایی دارد که آن را از نسخه های قبلش متمایز می‌کند. کاربردهای آن عبارتند از:

  • امکان طراحی ستون های متعدد
  • حاشیه و پس زمینه های جذاب
  • افکت های پیشرفته تر و زیباتر برای متن
  • قابلیت box sizing
  • امکان ایجاد گوشه نرم
  • امکان ایجاد دو یا سه سه بعدی کردن عناصر
  • امکان ایجاد تصاویر متحرک
  • امکان انتقال (Transition)
  • امکان جعبه سایه دار

  CSS3 چیست؟ کاربرد CSS3 در صفحات وب

تفاوت CSS3 با CSS

در واقع نسخه نهایی CSS یعنی CSS3 تفاوت های زیادی با CSS دارد که آن از بقیه نسخه ها متمایز کرده است. بعضی از تفاوت های CSS3 با CSS عبارتند از: 

CSS3 -1 دارای قابلیت انتخاب پیشرفته تگ های html است. / CSS داری تگ های محدود html است. 

CSS3 -2 از همه فرمت های رنگی پشتیبانی می‌کند. / CSS دارای فرمت های رنگی محدود است. 

CSS3 -3 را می‌توان با نوشتن کد ساده، گوشه های عناصر را گرد کرد. / CSS با نوشتن کد های سخت و پیچیده می‌تواند به این ویژگی دست پیدا کند. 

4- در CSS3 امکان ساخت افکت های پیشرفته و زیبا وجود دارد. / CSS امکان ساخت افکت های زیبا را ندارد. 

CSS3 -5  امکان این را می‌دهد که اشکال ساده، پیچیده و خاص را طراحی کرد. / CSS داری طراحی محدود اشکال ساده است.

CSS3 -6 سرعت زیادی در بارگذاری صفحات دارد. / CSS سرعت بارگذاری پایینی دارد.

7- با CSS3 طراحی سریع تر انجام می‌شود. / برای طراحی CSS نیاز به صرف زمان زیادی داریم. 

CSS3 -8 دارای بخش های مجزا به نام ماژول است. / CSS ماژول ندارد. 

CSS3 -9 برای پیدا کردن اندازه های صحیح عناصر، دارای ویژگی box sizing است. / CSS از مد های HSL، HSLA، RGBA پشتیبانی نمی‌کند. 

CSS3 -10 از ایجاد چند ستونی کردن متن ها پشتیبانی می‌کند. / CSS از تک ستونی بودن متن پشتیبانی می‌کند.

آینده CSS 

قبل از ظهور CSS، ما فقط شاهد HTML بودیم که طراحان سایت از آن استفاده می‌کردند که جلوه های بصری نداشت. اما بعد از، CSS طراحی به سطح بالاتری رسید و بعد از گذشت چند سال این نسخه پیشرفت کرد و به CSS3 ارتقاء یافت. بنابراین در آینده هم امکان بروزرسانی و ارتقاء CSS3 وجود دارد.

ما در این مقاله به سوال CSS3 چیست؟ کاربرد CSS3 در صفحات وب پرداختیم. همچنین ویژگی ها و تاریخچه آن را برایتان شرح دادیم. امیدواریم این مطالب، اطلاعات مورد نیازتان را در اختیار شما قرار داده باشد. شما می توانید پیشنهادات و انتقادات خود را در رابطه با موضوع CSS3 چیست؟ کاربرد CSS3 در صفحات وب از قسمت نظرات، با گروه آموزش برنامه نویسی صعود به اشتراک بگذارید. همچنین می‌توانید ما را در شبکه های اجتماعی تلگرام و اینستاگرام دنبال کنید.