黑白不透明度函数

Avatar of Chris Coyier
Chris Coyier

经常需要使用一些透明的黑色或白色。在 CSS 中,你可以使用

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

在 Sass 中,你可以用颜色名称替换,这会更方便

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

或者,你可以通过创建自定义函数来进一步简化

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

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