-÷итатник

 расота природы - (6)

__августовский закат___ „то может быть прекрасней закатов в августе свето-представление&nb...

ƒожди - (0)

Ћето началось с дождей Ќа улице отвратительна€ погода... ј € забыл зонтик в другом городе, а п...

ѕравда про ’ристианство из уст батюшки. - (0)

ќткровение св€щенника. ∆≈—“№!!!          ј ведь в чЄм-то он пр...

ѕро сутулость - (0)

—утулость - как исправить. ”пражнени€ дл€ исправлени€ сутулости

≈ще пара анекдотов. - (3)

јнекдоты   ¬ 2012 году, ћедведев не столько перестанет быть президентом, сколько продо...

 -ѕоиск по дневнику

ѕоиск сообщений в avia-free

 -ѕодписка по e-mail

 

 -—татистика

—татистика LiveInternet.ru: показано количество хитов и посетителей
—оздан: 30.08.2011
«аписей:
 омментариев:
Ќаписано: 5813

÷вета в CSS: цветовые модели и единицы измерени€

ƒневник

ѕонедельник, 18 январ€ 2016 г. 22:42 + в цитатник

ћатериал на основании учебной статьи "цвета в CSS".

“аблицы CSS имеют мощный набор инструментов дл€ работы с цветами.

¬ CSS3 работа с цветами стала ещЄ более мощной и гибкой. Ќо об этом не в начале поста, а по мере развити€ мысли.

»так, в CSS можно задать цвет в одной из форм кодировани€ или по названию. Ѕезусловно, названий ограниченное количество. ƒавайте перечисли некоторые:

navy морской
aqua голубой
blue синий

я совсем коротко это описал, чтобы было хоть какое-то представление о данной кодировке цветов. “ак как вс€ таблица возможных названий, которые должны понимать браузеры, имеет 146 слов. ¬се их тут € перечисл€ть не буду, их очень легко найти в Google.

¬от пример цветов: aquanavyblue.

“еперь о более сложном формате, о кодировании цветов по модели RGB. јббревиатура RGB обозначает первые буквы трЄх цветов и отражает саму суть этой модели.

  • Red - красный,
  • Green - зелЄный,
  • Blue - синий.

»менно сочетанием в разных пропорци€х этих трЄх цветом можно получить любой нужный нам цвет.

„исла могут быть в диапазоне от 0 до 255.

„тобы получить красный цвет, нужно указать rgb(255, 0, 0).

¬от пример такого цвета: красный.

¬ html-коде € просто выделил слово кодом: <span style="color: rgb(255, 0, 0)">красный</span>.

—ледующий тип кодировки - это HEX число. “о есть кодирование в шестнадцатеричной системе счислени€. Ёто самый распространЄнный способ кодировать цвета в веб-технологи€х на сегодн€шний день.

ƒл€ того, чтобы браузер пон€л что цвет задан в HEX, перед числом нужно поставить знак #. ƒалее идут шесть шестнадцатеричных чисел, которые представл€ют из себ€ три пары дл€ определени€ цветов, как в RGB.

Ќапример код #FF0000 - это обозначение красного цвета.

¬от пример такого цвета: красный.

¬от как в этом коде использовали кодирование HEX: <span style="color: #FF0000;">красный</span>.

“еперь поговорим об некоторых возможност€х по работе с цветами, которые по€вились в третьей версии таблиц CSS.

¬ этой версии по€вилась нова€ модель кодировани€ RGBA, котора€ основана на RGB. ѕросто в этой модели к RGB коду добавили ещЄ один поток, который обозначает прозрачность цвета. ƒавайте создадим блок красного цвета с разной степенью прозрачности.

<DIV style="background: rgba(255,0,0,1); width=300px"></DIV>
<DIV style="background: rgba(255,0,0,0.75); width=300px"></DIV>
<DIV style="background: rgba(255,0,0,0.50); width=300px"></DIV>
<DIV style="background: rgba(255,0,0,0.05); width=300px"></DIV>

“еперь результат работы этого кода:

 
 
 
 

Ќа этом пока всЄ. ∆дите следующих уроков.

 
 
–убрики:  ѕрограммирование/CSS

ћетки:  

 —траницы: [1]