دروس HTML

صفحة HTML الرئيسية مقدمة HTML محرري HTML أساسيات HTML عناصر HTML سمات HTML عناوين HTML فقرات HTML أنماط HTML تنسيق HTML اقتباسات HTML تعليقات HTML ألوان HTML HTML CSS روابط HTML صور HTML رمز HTML المفضل جداول HTML قوائم HTML كتلة HTML ومضمنة فئات HTML معرف HTML إطارات HTML IFrame HTML جافا سكريبت مسارات ملفات HTML رئيس HTML تنسيق HTML مستجيب لـ HTML HTML Computercode دلالات HTML دليل نمط HTML كيانات HTML رموز HTML HTML Emojis أحرف HTML تشفير عنوان URL لـ HTML HTML مقابل XHTML

نماذج HTML

نماذج HTML سمات نموذج HTML عناصر نموذج HTML أنواع إدخال HTML سمات إدخال HTML سمات نموذج إدخال HTML

رسومات HTML

قماش HTML HTML SVG

وسائط HTML

وسائط HTML فيديو HTML صوت HTML المكونات الإضافية لـ HTML HTML يوتيوب

واجهات برمجة تطبيقات HTML

HTML تحديد الموقع الجغرافي سحب / إسقاط HTML تخزين الويب HTML عمال ويب HTML HTML SSE

أمثلة HTML

أمثلة HTML مسابقة HTML تمارين HTML شهادة HTML ملخص HTML ولوجية HTML

مراجع HTML

قائمة علامات HTML سمات HTML سمات HTML العامة دعم متصفح HTML أحداث HTML ألوان HTML قماش HTML صوت / فيديو HTML أنماط HTML مجموعات أحرف HTML تشفير عنوان URL لـ HTML أكواد HTML لانج رسائل HTTP طرق HTTP PX to EM Converter اختصارات لوحة المفاتيح

ألوان HTML HSL و HSLA


HSL تعني تدرج اللون والتشبع والخفة.

قيم ألوان HSLA هي امتداد لـ HSL بقناة ألفا (عتامة).


قيم ألوان HSL

في HTML ، يمكن تحديد اللون باستخدام تدرج الألوان والتشبع والإضاءة (HSL) في النموذج:

hsl ( تدرج اللون ، التشبع ، الخفة )

Hue هي درجة على عجلة الألوان من 0 إلى 360. 0 أحمر ، و 120 أخضر ، و 240 أزرق.

التشبع هو قيمة النسبة المئوية ، 0٪ يعني ظل من الرمادي ، و 100٪ هو اللون الكامل.

الخفة هي أيضًا قيمة مئوية ، 0٪ أسود ، و 100٪ أبيض.

جرب عن طريق خلط قيم HSL أدناه:

hsl (0، 100٪، 50٪)

مسحة

0

التشبع

100٪

خفة

50٪

مثال

hsl(0, 100%, 50%)
hsl(240, 100%, 50%)
hsl(147, 50%, 47%)
hsl(300, 76%, 72%)
hsl(39, 100%, 50%)
hsl(248, 53%, 58%)


التشبع

يمكن وصف التشبع بأنه شدة اللون.

100٪ لون نقي ، لا ظلال رمادية

50٪ هو 50٪ رمادي ، لكن لا يزال بإمكانك رؤية اللون.

0٪ رمادي بالكامل ، لم يعد بإمكانك رؤية اللون.

مثال

hsl(0, 100%, 50%)
hsl(0, 80%, 50%)
hsl(0, 60%, 50%)
hsl(0, 40%, 50%)
hsl(0, 20%, 50%)
hsl(0, 0%, 50%)


خفة

يمكن وصف إضاءة اللون على أنها مقدار الضوء الذي تريد إعطاءه للون ، حيث يعني 0٪ عدم وجود ضوء (أسود) ، و 50٪ يعني 50٪ ضوء (لا داكن ولا فاتح) 100٪ يعني إضاءة كاملة (أبيض).

مثال

hsl(0, 100%, 0%)
hsl(0, 100%, 25%)
hsl(0, 100%, 50%)
hsl(0, 100%, 75%)
hsl(0, 100%, 90%)
hsl(0, 100%, 100%)


ظلال رمادية

غالبًا ما يتم تحديد ظلال الرمادي عن طريق ضبط تدرج اللون والتشبع على 0 ، وضبط الإضاءة من 0٪ إلى 100٪ للحصول على ظلال أغمق / أفتح:

مثال

hsl(0, 0%, 20%)
hsl(0, 0%, 30%)
hsl(0, 0%, 40%)
hsl(0, 0%, 60%)
hsl(0, 0%, 70%)
hsl(0, 0%, 90%)


قيم ألوان HSLA

قيم ألوان HSLA هي امتداد لقيم ألوان HSL مع قناة ألفا - والتي تحدد عتامة اللون.

يتم تحديد قيمة لون HSLA بـ:

هسلا ( هوى ، تشبع ، خفة ، ألفا )

المعلمة alpha عبارة عن رقم يتراوح بين 0.0 (شفاف تمامًا) و 1.0 (غير شفاف على الإطلاق):

جرب عن طريق خلط قيم HSLA أدناه:

هسلا (0، 100٪، 50٪، 0.5)

مسحة

0

التشبع

100٪

خفة

50٪

ألفا

0.5

مثال

hsla(9, 100%, 64%, 0)
hsla(9, 100%, 64%, 0.2)
hsla(9, 100%, 64%, 0.4)
hsla(9, 100%, 64%, 0.6)
hsla(9, 100%, 64%, 0.8)
hsla(9, 100%, 64%, 1)