Следует ли использовать rgba(0, 0, 0, 0, 0)
или rgba(255, 255, 255, 0)
для прозрачности в CSS?
Каковы плюсы и минусы каждого из них?
Последний параметр функции rgba()
- это параметр "альфа" или "непрозрачность". Если вы установите его в 0
, это будет означать "полностью прозрачный", а первые три параметра (каналы red
, green
и blue
) не будут иметь значения, потому что вы все равно не сможете увидеть цвет.
Учитывая это, я бы выбрал rgba(0, 0, 0, 0, 0)
, потому что:
Вы можете вообще избежать модели rgba
и использовать вместо нее ключевое слово transparent
, которое, согласно w3.org, эквивалентно "прозрачному черному" и должно вычисляться как rgba(0, 0, 0, 0, 0)
. Например:
h1 {
background-color: transparent;
}
Это сэкономит вам еще пару байт, в то время как ваши намерения использовать прозрачность очевидны (в случае, если кто-то не знаком с RGBA).
Начиная с CSS3, вы можете использовать ключевое слово transparent
для любого свойства CSS, которое принимает цвет.
Существует два способа хранения цвета с альфа-каналом. Первый - точно так, как вы видите, с каждым компонентом как есть. Второй - использовать предварительное умножение альфы, когда значения цвета умножаются на альфу после преобразования в диапазон 0.0-1.0; это делается для облегчения композитинга. Обычно вы не должны замечать или заботиться о том, какой способ реализован в том или ином движке, но есть угловые случаи, когда это может понадобиться, например, если вы попытаетесь увеличить непрозрачность цвета. Если вы используете rgba(0, 0, 0, 0, 0)
, вы с меньшей вероятностью увидите разницу между двумя подходами.
Есть небольшая разница, когда вы используете rgba(255,255,255,a), цвет фона становится все более и более светлым по мере увеличения значения 'a' от 0.0 до 1.0. В то время как при использовании rgba(0,0,0,a) цвет фона становится все более темным по мере увеличения значения 'a' от 0.0 до 1.0. При этом очевидно, что и (255,255,255,0), и (0,0,0,0) делают фон прозрачным. (255,255,255,1) сделает фон полностью белым, в то время как (0,0,0,0,1) сделает фон полностью черным.