آموزش CSS – ویژگی رنگ در CSS

  • آپدیت شده در تاریخ

آموزش CSS

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

خصیصه رنگ در CSS رنگ پیش زمینه را برای یک المان خاص تعریف می کند.

تنظیم خصیصه رنگ در CSS :

ویژگی color معمولا رنگ محتوای متن یک المان را تعریف می کند. به عنوان مثال خصیصه رنگ مشخص شده در سلکتور بدنه، رنگ پیش فرض متن را برای کل صفحه تعریف می کند.

رنگ ها در زبان CSS اغلب توسط روش های زیر مشخص می شود:

  •   مقادیر هگزا دسیمال مثلا #ff0000
  •   مقادیر RGB  مثلا rgb(255,0,0)
  •   نام رنگ  مثلا red

مقادیر هگزادسیمال رنگ ها

  • علامت # در شروع، نشان دهنده مبنای ۱۶ است.
  • مقادیر به صورت جفت از ۰۰ تا FF موجود هستند.
  • سه جفت عدد رنگ را به صورت RGB نشان می‌دهد.

در این روش که بدلیل کوتاه و ساده بودن کد رنگ بیشترین استفاده رو داره رنگ به صورت rrggbb# نشان داده می شود و از اعداد مبنای ۸ (HexaDecimal) به جای اعداد دهدهی است که rr و gg و bb به ترتیب مقدار عددی شدت رنگ های قرمز ، سبز و آبی رو نشون میدهد و مقادیر هگزادسیمال بین ۰۰ تا FF که معادل همون ۰ تا ۲۵۵ دهدهی هست را میتوانند بگیرند

اگر شما اعداد را بصورت ۳ حرفی بجای ۶ حرفی وارد کنید برای مرورگر این معنی را خواهد داشت که سایر ارقام آن رنگ نیز همان مقدار را دارد. مثلا:

نام رنگ

لیست کلیه نام رنگ ها را که در CSS می توانید استفاده کنید در لینک زیر لیست شده است :

https://www.w3schools.com/colors/colors_names.asp

رنگ RGB

حروف آن نماینده همان ۳ رنگ اصلی آبی B، قرمز R و سبز G هستند. در این روش بدون تبدیل مبنا اعداد در بازه ای بین ۰ تا ۲۵۵ (۲۵۶ سطح) تعریف می شوند. مانند:

تاثیر خصیصه رنگ بر روی حاشیه ها و Outlineها:

خصیصه رنگ تنها برای محتوای متن نیست. این خصیصه برای هر چیزی که در فورگراند قرار دارد و می تواند مقادیر رنگ را اتخاذ نماید مورد استفاده قرار می گیرد.

به عنوان مثال اگر مقادیر رنگ حاشیه یا رنگ outline به طور واضح و برای المان موردنظر تعریف نشده باشد، مقدار رنگ به جای آن مورد استفاده قرار خواهد گرفت.

نکته: خصیصه رنگ به طور طبیعی مقدار رنگ را از المان والد خود به ارث می برد. این قانون یک استثنا دارد و آن هم در مورد المان Anchor است

 

امیدوارم در این بخش آموزش CSS, از خصوصیت رنگ در CSS نهایت استفاده را برده باشید.

هر سوالی داشتید ، از قسمت نظرات ارسال کنید . سریعا ، پاسخگوی سوالات شما هستیم .

موفق باشید.

حسن شفیعی علاقه خاصی به برنامه نویسی وب و موبایل دارم و هر روز تلاش می کنم به این حوزه مسلط تر شوم و اطلاعاتم را به شکل کاربردی برای علاقه مندان در وب به اشتراک بگذارم

آموزش های رایگان بیشتر در اینستاگرام ما ...

NETPARADIS /
مطالب زیر را حتما بخوانید
دیدگاه کاربران

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

    دوره های آموزشی

    می خواهید صفر تا صد HTML,CSS را یاد بگیرید ؟

    50% تخفیف ویژه
    فقط 144 هزار تومان

    برای دریافت آموزش طراحی سایت با پروژه قالب فروشگاه روی دکمه زیر بزنید
    می خواهم طراحی سایت را یاد بگیرم
    close-link