خصائص CSS اللون. رموز الألوان

واحدة من الأدوات اللازمة لتغيير أنماط صفحة ويب - اللون CSS. هناك عدة طرق لتغيير هذا الإعداد. لكل منها مزايا وعيوب.

اسم

الخاصية اللون يحدد اللون في البند. 145 ظلال من العناوين المدرجة في CSS. ومن بين هؤلاء هناك بسيطة (مثل الأسود والأزرق) ومجمع (مثل القرمزي، lawngreen).

لأن القائمة بأكملها من الصعب أن نتذكر، يتم استخدام اسم ورقة الأنماط نادرا.

RGB

معظم أجهزة التلفاز، والهواتف الذكية، وأجهزة قياس العمل مع نموذج لون RGB. وهذا هو، يمكن تعيين أي لون لمزيج من الألوان الأساسية، والتي هي الأحمر والأخضر والأزرق. . ويستخدم نهج مماثل في كلا الجهازين، وفي CSS. основного состава принимают значения от 0 до 255. А количество возможных оттенков равно 16777216. الألوان هي القيم الأساسية تكوين تتخذ من 0 إلى 255. عدد من الألوان الممكنة يساوي 16777216.

منذ يرتبط نموذج RGB مباشرة إلى القوانين الفيزيائية التصوير اللون، يتم تحديد أسود فيه مثل RGB (0، 0، 0)، والأبيض - RGB (255، 255، 255). نظام RGBA مماثل تماما لRGB، مع إضافة قناة ألفا. لأنه يؤثر على الشفافية، التي تمزج مع الظل الخلفية. في هذا النوع من العنصر سوف تختلف وفقا ل "الركيزة".

HSL

لفهم كيف يمكن لنظام HLS، تحتاج إلى تقديم عجلة الألوان. في وسطها باللون الأحمر، ثم (عقارب الساعة) كل الألوان الأخرى من قوس قزح. цвета при помощи системы HLS требуется задать три параметра: لتحديد الألوان في CSS باستخدام نظام HLS يتطلب المعلمات الثلاث:

• هوى (في درجة) - اتجاه مركز الدائرة.
• التشبع (نسبة مئوية) - كم اللون الذي تحتاج إليه.
• السطوع (في المئة).

على سبيل المثال، الأرجواني يمكن تحديدها في مثل هذه الطريقة: هسل (315، 100٪، 45٪). HSL هو الأكثر ملاءمة لإجراء التجارب. بعد دراسة عجلة الألوان، يمكنك أثناء مشاهدة أنماط تمثل تقريبا ما لون تحديد عنصر معين. HSLA - نفس HLS، فقط مع ألفا: هسل (0، 100٪، 50، 0.6) - أحمر، شفافة قليلا أكثر من النصف.

HEX

CSS цвета можно задать, используя шестнадцатеричное представление, например оранжевый определяется значением #FF4500 . في CSS، يمكنك تعيين اللون باستخدام تمثيل عشري، مثل البرتقال تحددها قيمة # FF4500.

من أجل فهم أفضل لما تمثيل عشري، ينبغي مواصلة النظر في النظام العشري. وهو رقم من 0 إلى 9. عندما يتم إضافة حرف واحد الحاجة في عد عدد أكبر من 9، ويتحول 10، ثم 100، وهلم جرا. E. جميع بالضبط نفس الشيء في تدوين ست عشري، ولكن في بعد 9 غير A، ثم B، وهلم جرا إلى F - نفس 15 في النظام العشري. ثم إضافة رقم واحد، واتضح 10 من 16 في الشروط المعتادة.

كما هو الحال في RGB، والألوان HEX للإشارة في ما نسب إلى استخدام الألوان الأساسية. في هذه الحالة، لا يتم فصلهم بفواصل (اللون: # FFD500). كل حرفين تحدد عدد من الأحمر والأخضر والأزرق.

CSS. وكقاعدة عامة، لا يتم استخدام نظام HEX خلال التجارب، لأنه من المستحيل أن تجد اللون المناسب CSS. может помочь в этом деле, но если постоянно сверяться с ней, работа затянется. الجدول يمكن أن تساعد في هذا الأمر، ولكن إذا كنت أشير باستمرار إلى ذلك، سيتم تأجيل العمل. تمثيل عشري هو الأكثر ملاءمة عندما يتم نقل القالب من محرر الرسوم البيانية. انه من الاسهل بكثير لنسخ منه رقم واحد فقط من ثلاث لفات.

الطريقة التي هو أفضل؟

على هذا الحساب لا نستطيع أن نقول أي شيء ملموس. إذا كانت عناصر من واجهة تحتاج الشفافية والاختيار بين RGBA وHSLA. إذا كنت ترغب في تجربة في المتصفح HLS عجلة الألوان سوف تكون أكثر ملاءمة. إذا كنت تستخدم لوحة أو نقل التصميم من فوتوشوب، يجب تفضل CSS عشري رموز الألوان.