HSLA

Точно так же, как rgba() добавляет к старой функции rgb() значение непрозрачности, hsla() делает это для функции предыдущего поколения hsl().

Функция hsla() — всего лишь очередной инструмент генерации цвета элемента, но его преимущество в том, что он интуитивно понятнее, чем rgba(). Многим дизайнерам проще создавать собственные наборы цветов с использованием hsla(). Синтаксис функции таков: hsla(TOH, насыщенность, яркость, непрозрачность).

Согласно синтаксису, тон представляет один из цветов воображаемого цветового круга — это значение от 0 до 360, выраженное в градусах. Вокруг значений 0 и 360° находятся красные цвета, вокруг 120° — зеленые, а вокруг 240° — синие. Насыщенность — это процентное значение в диапазоне от 0 % (шкала серых тонов) до 100 % (полный цвет или полное насыщение). Яркость — это также процентное значение от 0 % (абсолютно темный цвет) до 100 % (абсолютно яркий цвет). Значение 50 % определяет среднюю яркость. Последний аргумент функции hsla(), так же, как и в функции rgba(), указывает уровень непрозрачности.

Листинг 3.16. Новый цвет для заголовка определяется с помощью hsla()

#title {

Font: bold 36px MyNewFont, verdana, sans-serif; text-shadow: rgba(0,0,0,0.5) 3px 3px 5px; color: hsla(120, 100%, 50%, 0.5);

}

Замените кодом из листинга 3.16 соответствующий код в листинге 3.11 и проверьте результат в своем браузере.