Funciones de opacidad en blanco y negro | Programar Plus

Es bastante común necesitar un poco de blanco o negro transparente. En CSS, puede hacer:

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

Se vuelve más fácil en Sass, donde puede sustituir el nombre de un color:

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

O hazlo aún más fácil, creando funciones personalizadas:

@function black($opacity) {
  @return rgba(black, $opacity)
}
@function white($opacity) {
  @return rgba(white, $opacity)
}

.half-black {
  background: black(0.5);
}
(Visited 2 times, 1 visits today)