صفحه نخست » مقالات » برنامه نویسی » آموزش CSS » css3 چیست؟ کاربردها و معرفی کامل css3

css3 چیست؟ کاربردها و معرفی کامل css3

دسته بندی : آموزش CSS سطح مقاله : مقدماتی زمان مطالعه : 3 دقیقه 04 ژانویه 2021
css3-چیست

معرفی CSS3 رو که آخرین نسخه از زبان CSS است و بسیار محبوب و کاربردی خواهد بود و تقریبا تمامی وب سایت های بروز جهان از این نسخه از css استفاده می کنند و با امکانات بی نظیری که در اختیار توسعه دهندگان قرار داده باعث پیشرفت هرچه سریعتر پروژه ها شود را با عنوان css3 چیست؟ برای شما دوستان آماده کرده ایم.

این آموزش ویژگی های اصلی CSS3 مانند سایه های جعبه ، قلم ها ، گوشه های گرد ، انتخابگرها و ماژول ها را مرور می کند.

پس با Css3 چیست؟ همراه ما باشید.

معرفی مختصر CSS3

نسخه CSS3 ویژگی های جدیدی را ارائه داد که به توسعه دهندگان امکان می داد عناصر HTML را با کد CSS کمتری استایل کنند.

CSS3 مشهورترین ماژول هایی است که روند مشخصات را تسریع می کنند.

در ابتدا ، مرورگرها از ویژگی های CSS3 پشتیبانی نمی کردند و مدتی طول کشید تا کاملاً سازگار شوند.

بخاطر بسپارید: CSS3 با نسخه های قبلی CSS سازگار است. این بدان معنی است که ویژگی های CSS3 با استفاده از CSS قدیمی در صفحات وب کار می کنند.

مرورگرهایی که از CSS2 پشتیبانی می کنند نیز تغییرات با CSS3 را نشان می دهند.

9 سال طول کشید تا CSS سطح 2 وضعیت توسعه را بدست آورد زیرا برخی از ویژگی ها مشخصات را به تأخیر می اندازند.

برای سرعت بخشیدن به این فرآیند ، گروه کاری CSS ، CSS  را به قسمتهای راحت تری تقسیم کرد که از آنها به عنوان ماژول یاد می شود.

توجه: ماژول ها اکنون اجزای جداگانه ای از زبان هستند و مشخصات آنها به قسمت های دیگر CSS بستگی ندارد.

مزیت اصلی ماژول ها تضمین این است که همه استایل ها برای یک مولفه خاص در یک مکان نگهداری می شوند و فقط در مورد آن مولفه اعمال می شوند و نه چیز دیگری.

تفاوت بین CSS و CSS3

تفاوت اصلی بین CSS و CSS3 این است که CSS3 ویژگی های جدیدی را ارائه می دهد و CSS را به ماژول های مناسب جدا می کند.

همچنین ، CSS2 شامل یک مشخصات واحد بود که ویژگی های فردی را تعریف می کرد. با این حال ، اسناد جداگانه (ماژول ها) ویژگی های CSS3 را ارائه می دهند.

توجه: هر ماژول ویژگی ها و ویژگی های جدیدی مانند گوشه های گرد ، تصاویر حاشیه ای ، سایه ها ، شیب ها ، انتقال ها ، انیمیشن ها را اضافه می کند.

CSS3 در مقابل CSS

CSS3 کد قدیمی CSS را منسوخ نمی کند زیرا این فقط یک ویژگی اضافه شده توسط CSS1 است. این لیست بحثهای اصلی را در بحث CSS3 در مقابل CSS ارائه می دهد:

  • CSS3 به توسعه دهندگان اجازه می دهد تا عناصر HTML را استایل راحت تر تبدیل کنند. وابستگی کمتری به پرونده های تصویری دارند و می توانند با خطوط کمتری از کد ، CSS را کامل کنند.
  • هدف CSS1 قالب بندی ظاهری بود و اجازه طراحی های پاسخگو را نمی داد.

بررسی اجمالی ویژگی های جدید Css3

Box Shadow ها در css3

یکی از ویژگی های جدید CSS3 ویژگی box-shadow است که به عنصر سایه می افزاید.

به جای استفاده از چندین تصویر در اطراف یک مورد ، این ویژگی به شما امکان می دهد سایه را با یک خط کوتاه کد اضافه کنید.

Opacity در css3

یکی از خصوصیات CSS3 به نام opacity عناصر را به طور شفاف یا کاملاً شفاف می کند.

به عنوان مثال ، می توانید opacity را روی تصاویر یا سایر عناصر HTML اعمال کنید.

سطح شفافیت به مقادیر نشان داده شده بستگی دارد.

Rounded Corners

قبل از انتشار CSS3 ، توسعه دهندگان برای تولید گوشه های گرد مجبور بودند کد طولانی بنویسند.

اکنون کافی است که ویژگی CSS3 با  border-radius را روی عناصر HTML اعمال کنید.

انتخابگرهای ویژگی

CSS3 علاوه بر انتخاب در CSS2 ، انتخابگرهای جدیدی را نیز معرفی کرد. به جای استفاده از IDs یا classes برای یک ظاهر طراحی شده ، توسعه دهندگان می توانند عناصر HTML را با توجه به ویژگی های آن ها انتخاب کنند.

در نتیجه ، فقط برای اعمال قوانین CSS لازم نیست شناسه های منحصر به فرد ایجاد کنید.

رنگهای جدید در css3

یکی از ویژگی های CSS3 افزودن رنگ های جدید است:

  • RGBA
  • HSL
  • HSLA
  • Gradient Colors

قلم های ایمن وب

به جای استفاده از قلم هایی که تگ ایمن در وب دارند ، اکنون توسعه دهندگان می توانند فونت های منحصر به فرد بیشتری را در اسناد HTML خود اعمال کنند.

قبل از آن ، CSS می خواست اطمینان حاصل کند که همه مرورگرها و ماشین ها فونت ها را یکسان نشان می دهند.

نکات مفید ویژگی های CSS3:

  • CSS3 از طرح های پاسخگو پشتیبانی می کند و پرس و جوهای رسانه را مدیریت می کند (برای تعیین دستگاهها و اندازه صفحه نمایش کاربران استفاده می شود).
  • از آنجا که ویژگی های جدید CSS3 به شما امکان می دهد خطوط کد کمتری تولید کنید ، می توانید سرعت وب سایت را افزایش دهید.
  • از زمان CSS3 ، انیمیشن های CSS بدون جاوا اسکریپت یا کد Flash حرکت می کنند.

مقاله css3 چیست؟ به پایان رسید لطفا نظرات و سوالات خود را برای ما ارسال کنید.

چه امتیازی به این مقاله می دید؟

دیدگاه کاربران

بدون دیدگاه


Notice: Undefined variable: user_ID in /home/devixir/public_html/wp-content/themes/DevixFullOne/comments.php on line 16