3. Css: свойства цвета и фона.

Эти свойства описывают цвет (зачастую именуемый как цвет переднего плана) и фон для элемента (т.е. поверхность, на которой располагается содержание). Они позволяют установить цвет фона и(или) его рисунок. Также определяются позиция изображения рисунка фона, повторяется ли он и каким образом, и где он размещается либо перемещается относительно холста.

Свойство "цвет", как правило, наследуется. Свойство "фон" не наследуется, но фон родительского элемента будет виден на просвет, т.к. по умолчанию значение цвета фона для дочерних элементов принимается как 'transparent' (прозрачный).

Определение цвета ('color')

Значение: <color>

По умолчанию: Определяется UA

Область применения: все элементы

Наследование: есть

Процентное выражение: неопр.

Это свойство описывает цвет текста в элементе (зачастую именуемый как цвет переднего плана). Есть несколько разных способов описать, к примеру, красный цвет:

EM { color: red } /* natural language */

EM { color: rgb(255,0,0) } /* RGB range 0-255 */

Давайте разберем каким образом можно указывать цвет.

Цвет обозначатся либо зарезервированным словом, либо численно по спецификации RGB.

Допустимы следующие зарезервированные слова для указания цвета: aqua (светло-голубой), black (черный), blue (синий), fuchsia (светло-фиолетовый), gray (серый), green (зеленый), lime (светло-зеленый), maroon (коричневый), navy (темно-синий), olive (оливковый), purple (фиолетовый), red (красный), silver (светло-серый), teal (сине-зеленый), white (белый), и yellow (желтый). Эти 16 цветов взяты из палитры VGA для Windows.

BODY {color: black; background: white }

H1 { color: maroon }

H2 { color: olive }

Для цветовой модели RGB используются численные выражения. В нижеприведенных примерах определяется один и тот же цвет:

EM { color: #f00 } /* #rgb */

EM { color: #ff0000 } /* #rrggbb */

EM { color: rgb(255,0,0) } /* диапазон целых чисел 0 - 255 */

EM { color: rgb(100%, 0%, 0%) } /* диапазон вещественных чисел 0.0% - 100.0% */

Значения в формате RGB указываются в шестнадцатеричной системе счисления в виде знака #, за которым без пробелов указываются три или шесть шестнадцатеричных символа. Трехсимвольная запись RGB (#rgb) преобразовывается в шестисимвольную путем дублирования цифр, а не добавлением нулей. Например, #fb0 расширяется до #ffbb00. Поэтому понятно, что белый цвет (#ffffff) может быть кратко записан как (#fff), и это устранит любые зависимости от специфики отображения цвета на экране.

Формат значения RGB в функциональной записи следующий: 'rgb(' далее разделенный точками список из трех численных значений (либо три целочисленных значения в интервале 0-255, либо три процентных значения в диапазоне от 0.0% до 100.0%), далее ')'.

Значения за пределами числовых интервалов должны отсекаться. Ниже приводятся три эквивалентных примера:

EM { color: rgb(255,0,0) } /* значения в диапазоне 0 - 255 */

EM { color: rgb(300,0,0) } /* 300 автоматически заменится на 255 */

EM { color: rgb(110%, 0%, 0%) } /* 110% автоматически заменится на 100% */

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

UA может накладывать ограничения на указанные условия для отображаемых цветов, производя коррекцию их гаммы. UA регулирует заданные CSS цвета таким образом, чтобы применительно к устройству вывода получить "естественную" гамму цветов. Обратите внимание, что речь идет только о цветах, определенных через CSS, а, к примеру, для графических изображений будет использоваться их собственная цветовая информация.