#css #background #opacity #tailwind-css #tailwind-ui
Вопрос:
Мне было любопытно узнать о CSS, стоящем за непрозрачностью tailwinds bg. Я мог найти «непрозрачность» только в чистом CSS, но это влияет на все, а не только на фон. Не мог бы кто-нибудь, пожалуйста, объяснить это?
Комментарии:
1. Пожалуйста, отредактируйте вопрос, чтобы ограничить его конкретной проблемой с достаточной детализацией для определения адекватного ответа.
Ответ №1:
Непрозрачность фона попутного ветра влияет на переменную, которая используется в параметре цвета. Попутный ветер использует rgba(red, green, blue, opacity) , где последним параметром является непрозрачность цвета.
Например .bg-black , выглядит так:
.bg-black {
--tw-bg-opacity: 1;
background-color: rgba(0,0,0,var(--tw-bg-opacity));
}
и bg-opacity-50 выглядит так:
.bg-opacity-50 {
--tw-bg-opacity: 0.5;
}
он перегружает --tw-bg-opacity переменную и приводит к:
background-color: rgba(0,0,0,0.5)