الألوان داخل لغة HTML

ما هي HTML Colors ؟


الألوان داخل لغة HTML يتم تحديدها بإستخدام أسماء ألوان محددة مسبقاً أو قيم RGB و HEX و HSL و RGBA و HSLA.

الألوان داخل لغة HTML

في لغة HTML، يُمكن تحديد لون بإستخدام إسم اللون.
تدعم لغة HTML أكثر من 140 أسماء للألوان.

لون الخلفية فى لغة HTML

يُمكنك تعيين لون الخلفية لعناصر HTML.
مثال:

<h1 style="background-color:DodgerBlue;">Hello World</h1>
<p style="background-color:Tomato;">Lorem ipsum...</p>

لون النص فى لغة HTML


You can set the color of text:

مثال إستخدام الكود التالي:


<h1 style="color:Tomato;">Hello World</h1>
<p style="color:DodgerBlue;">Lorem ipsum...</p>
<p style="color:MediumSeaGreen;">Ut wisi enim...</p>

لون الحدود فى لغة HTML

يُمكنك ضبط لون الحدود.
مثال:

<h1 style="border:2px solid Tomato;">Hello World</h1>
<h1 style="border:2px solid DodgerBlue;">Hello World</h1>
<h1 style="border:2px solid Violet;">Hello World</h1>

قيم الألوان المختلفة فى لغة HTML

في لغة HTML، يُمكن أيضاً تحديد الألوان بإستخدام قيم RGB وقيم HEX وقيم HSL وقيم RGBA وقيم HSLA:
نفس إسم اللون "الطماطم".
مثال:

<h1 style="background-color:rgb(255, 99, 71);">...</h1><h1 style="background-color:#ff6347;">...</h1>
<h1 style="background-color:hsl(9, 100%, 64%);">...</h1>
<h1 style="background-color:rgba(255, 99, 71, 0.5);">...</h1><h1 style="background-color:hsla(9, 100%, 64%, 0.5);">...</h1>

القيمة RBG

في لغة HTML، يُمكن تحديد لون كقيمة RGB، بإستخدام هذه الصيغة
RGB "أحمر، أخضر، أزرق"
تُحدد كل معلمة "أحمر وأخضر وأزرق" شدة اللون بين 0 و255.
على سبيل المثال، يتم عرض rgb (255 ، 0 ، 0) باللون الأحمر، لأنه يتم تعيين الأحمر إلى أعلى قيمة له (255) ويتم تعيين الآخرين إلى 0.
لعرض اللون الأسود، يجب تعيين كل معلمات اللون على 0، مثل هذا: rgb (0 ، 0 ، 0).
لعرض اللون الأبيض، يجب تعيين كل معلمات اللون على 255، مثل هذا: rgb (255 ، 255 ، 255).

القيمة HEX

في HTML، يُمكن تحديد لون بإستخدام قيمة سداسية عشرية في النموذج:
#rrggbb
حيث rr (red) و gg (green) و bb (blue) هي قيم سداسية عشرية بين 00 و ff (مثل العشري 0-255).
على سبيل المثال، يتم عرض  #ff0000 باللون الأحمر، لأنه يتم تعيين اللون الأحمر إلى أعلى قيمة له (ff) ويتم تعيين الآخرين إلى أدنى قيمة (00).

القيمة HSL

في HTML، يُمكن تحديد لون بإستخدام hue و saturation و lightness )HSL) في النموذج:
hsl "تدرج، تشبع، خفة".
هيو هي درجة على عجلة الألوان من 0 إلى 360. 0 أحمر، و 120 أخضر، و 240 أزرق.
التشبع هو قيمة النسبة المئوية، 0 ٪ يعني الظل من الرمادي، و 100 ٪ هو اللون الكامل.
الخفة هي أيضاً نسبة، 0٪ سوداء، 50٪ ليست خفيفة أو داكنة، 100٪ بيضاء.

التشبع

يُمكن وصف التشبع على أنه شدة اللون.
100 ٪ هو لون نقي، أي ظلال من اللون الرمادي.
50٪ رمادي بنسبة 50٪، ولكن لا يزال بإمكانك رؤية اللون.
0٪ رمادي تماماً، ولم يعد بإمكانك رؤية اللون.

الخفة

يُمكن وصف خفة اللون بأنها مقدار الضوء الذي تريد أن تعطيه للون،
حيث 0٪ يعني عدم وجود ضوء "أسود"، 50٪ يعني 50٪ ضوء "لا داكن ولا فاتح" 100٪ يعني الخفة الكاملة "أبيض".
غالباً ما يتم تحديد درجات الرمادي من خلال ضبط درجة اللون والتشبع على 0، وضبط الإضاءة من 0٪ إلى 100٪ للحصول على ظلال داكنة أو خفيفة.

معلومات عن القيمة RBG

قيم اللون RGBA هي إمتداد لقيم ألوان RGB مع قناة ألفا والتي بدورها تُحدد عتامة اللون.
يتم تحديد قيمة لون RGBA مع:
rgba "أحمر، أخضر، أزرق، ألفا".
المعلمة alpha هي رقم بين 0.0 "شفاف بالكامل" و 1.0 "غير شفاف على الإطلاق".

معلومات عن القيمة HSLA

قيم ألوان HSLA هي إمتداد لقيم ألوان HSL مع قناة ألفا والتي تُحدد عتامة اللون.
يتم تحديد قيمة لون HSLA مع:
hsla "تدرج، تشبع، خفة، ألفا"
المعلمة alpha هي رقم بين 0.0 "شفاف بالكامل" و1.0 "غير شفاف على الإطلاق".

0 التعليقات

إرسال تعليق