Возможности применения цвета в CSS3. Cпецификация CSS3 предусматривает определение непрозрачности для элементов.

Полный список статей / Возможности применения цвета в CSS3 / Версия для печати / translit / абракадабра :-)

Хотя сейчас еще преждевременно с уверенностью утверждать, какие браузеры будут поддерживать грядущую спецификацию CSS3, некоторые аспекты обеспечения цвета заслуживают по меньшей мере краткого упоминания, с тем чтобы указать на будущие возможности.

Во-первых, спецификация CSS3 предусматривает определение непрозрачности для элементов. Той же цели можно добиться с помощью видоизмененной спецификации цвета, которая обозначается как rgba - в ней в качестве четвертого значения добавляется альфа. Альфа-фактор варьирует от 0,0 (полная прозрачность) до 1,0 (полная непрозрачность). В CSS3 можно применять правила наподобие этого:

em {color: rgba(255,0,0,1);} /* полностью непрозрачный красный */
strong {color: rgba(0, 0, 255, 0.5);} /* частично прозрачный зеленый */

Другое усовершенствование, представленное в CSS3, заключается в возможности задавать цвет в формате HSL (Hue Saturation Lightness, тон-насыщенность-яркость). Цвета HSL определяются в виде трех значений (тон, насыщенность, яркость). Тон представляется как угол цветового круга, где красному соответствует 0 или 360, зеленому - 120, синему - 240, а другие цвета находятся в диапазоне между этими значениями. Насыщенность выражается в процентах, так что 0% обозначает отсутствие насыщенности, или градацию серого, в то время как 100% - это полная насыщенность тона. Яркость также выражается в процентном отношении; при этом 100% обозначает яркость в форме белого, а 0% - в форме черного. Чаще всего будет применяться значение яркости 50%, устанавливающее "нормальную" величину. Принимая во внимание эти спецификации, имеют смысл следующие правила CSS:

.red {color: hsl(0, 100%, 50%); }
.green {color: hsl(120,100%,50%);}
.darkgreen {color: hsl(120,100%,75%);}
.lightgreen {color: hsl(120,100%,25%);}
.blue {color: hsl(240,100%,50%);}
.white {color: hsl(0,0%,100%);}
.black {color: hsl(0,0%,0%);}

Хотя это может показаться еще одним способом определения цвета, регулировка спецификации HSL более наглядна, и в большинстве случаев вариации цвета проще создавать, сохраняя тон, но корректируя насыщенность и интенсивность.

Как и спецификация цвета RGB, цвета HSL в CSS3 также должны поддерживать альфа-факторы; они измеряются значениями HSLA (тон, насыщенность, яркость, альфа-фактор). К примеру, правило определяло бы полупрозрачный светло-зеленый цвет.

.translightgreen {color: hsla(120,100%, 25%, .0.5);}

Наконец, в CSS3 должны быть представлены свойства наподобие color-profile, которое сделает возможным определение цветового профиля (http://www.color.org) Международного консорциума по цвету (International Color Consortium, ICC). К примеру, для корректировки цветов изображений на странице CSS3 можно было бы задействовать правило вроде следующего:

img {color-profile: URL("http://example.com/profiles/eg.icm"); }CSS3

Способность корректировки цветовоспроизведения в браузерах долго заставляла себя ждать. Реальная проблема с цветом в Web, которую мы усматриваем, состоит в том, что с таким широким выбором сред просмотра различие между цветами, которые мы определяем, и тем, что на самом деле появляется, может быть довольно существенным - если не проявлять осторожность.

css-info.narod.ru/statya/color-css3.html