Funções de opacidade em preto e branco - CSS-Tricks

Anonim

É muito comum precisar de um pouco de preto ou branco transparente. Em CSS, você pode fazer:

.half-black ( background: rgba(0, 0, 0, 0.5); )

Fica mais fácil no Sass, onde você pode substituir um nome de cor:

.half-black ( background: rgba(black, 0.5); )

Ou torne ainda mais fácil, tornando funções personalizadas:

@function black($opacity) ( @return rgba(black, $opacity) ) @function white($opacity) ( @return rgba(white, $opacity) ) .half-black ( background: black(0.5); )