رنگ متن در CSS – ویژگی color

ویژگی color در CSS برای تعیین رنگ متن و همچنین رنگ پیشفرض تزئینات متن در المان های HTML به کار می‌رود. این ویژگی از جمله ویژگی‌های پرکاربرد در سی‌اس‌اس محسوب می‌شود.

نحوه تعیین رنگ متن المان ها در CSS

مقدار ویژگی color مشابه با سایر رنگ‌های ساده در CSS معمولا با نام رنگ، مقدار هگز یا مقدار RGB رنگ مشخص می‌شود. در مثال زیر نمونه‌ای از تعیین رنگ با کمک ویژگی color را برای هدینگ های سطح دوم (المان های <h2>) مشاهده می‌کنید:

h2 {
  color: blue;
}

در این مثال، مقدار ویژگی color با کمک نام رنگ (یعنی blue) مشخص شده است. به این ترتیب رنگ متن المان‌های <h2> داخل سند، آبی خواهد شد.

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

h2 {color: blue;}
h2 {color: #00f;}
h2 {color: #0000ff;}
h2 {color: rgb(0,0,255);}
h2 {color: rgb(0%, 0%, 100%);}

بیشتر بخوانید: فهرست کد و نام رنگ های رایج وب

چند نکته در مورد ویژگی color

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

نکته دوم: مقدار ویژگی color صرفا می‌تواند یک رنگ ساده یا یکنواخت باشد و نمی‌تواند یک رنگ شیبدار یا Gradient را شامل شود.

بازگشت به فهرست مجموعه آموزشی CSS

امیرحسین شهسواری

عاشق دنیای رایانه و فناوری به خصوص برنامه نویسی هستم؛ یادگرفتن و البته یاد دادن چیزای جالبی که یاد گرفتم باعث خوشحالیم میشه و از اولویت‌های اصلی زندگیم به حساب میاد. از مدیریت و نوشتن در تک دیک هم واقعا لذت می‌برم :)

دیدگاهتان را بنویسید

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