انتقل إلى محتوى الدرس

CSS Hex Color طريقة إستخدام ألوان الهيكس في لغة CSS

ستتلعم في هذا الدرس إضافة ألوان لعناصر HTML التي تحتوي علي محتوي نصي وتغيير الألوان الأفتراضية للنصوص إلي أي لون أخر يتماشي مع تصميم صفحة الويب.

1 صفوف تعليمية
لغة CSS
14,695 مشاهدة

شرح صفوف ومحتوى الفقرة

الصف 1 شرح توضيحي

تعبّر ألوان HEX عن المكونات الأحمر والأخضر والأزرق بالترتيب RGB، وتقرأ الصيغة من اليسار إلى اليمين بعد #.

  • في #RRGGBB لكل مكوّن خانتان سداسيتان، من 00 إلى ff؛ الأرقام هي 0–9 والحروف a–f، ولا يختلف المعنى باختلاف حالة الحروف.
  • الأحمر #ff0000، والأزرق #0000ff، والأخضر #00ff00.
  • يمكن الاختصار إلى #RGB عندما تتكرر الخانتان في كل زوج: #ff0000 تصبح #f00 و#ffaa00 تصبح #fa0. يكرر المتصفح كل خانة عند توسيع الصيغة القصيرة.
  • خفض المكوّن الأحمر من ff إلى ee يخفض شدة ذلك المكوّن؛ النتيجة الكلية تعتمد على بقية المكونات أيضًا.
  • توجد صيغتا #RGBA و#RRGGBBAA لإضافة alpha؛ 00 شفافية كاملة وff عتامة كاملة.
ترتيب قنوات ألوان HEX في CSS وطريقة الاختصار

HEX color

إضافة اللون الأحمر الصريح f00.

HEX color

طريقة إستخدام خاصية color مع hex color.

HTML
h1 {
color:#f00;
}

HEX color blue

إضافة اللون الأزرق الصريح 00f.

HEX color

طريقة إستخدام خاصية color مع hex color.

HTML
h1 {
color:#00f;
}