CSS |
Возможности применения цвета в CSS3 |
меню |
|
CSS3 Статьи > Возможности применения цвета в CSS3
Хотя сейчас еще преждевременно с уверенностью утверждать, какие браузеры будут поддерживать грядущую спецификацию CSS3, некоторые аспекты обеспечения цвета заслуживают по меньшей мере краткого упоминания, с тем чтобы указать на будущие возможности.
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, которую мы усматриваем, состоит в том, что с таким широким выбором сред просмотра различие между цветами, которые мы определяем, и тем, что на самом деле появляется, может быть довольно существенным - если не проявлять осторожность. CSS3 |
На верх |