颜色的alpha通道

颜色的alpha通道标识了色彩的透明度，它是一个0~1之间的取值，0标识完全透明，1标识完全不透明

在css中使用rgba可以为颜色添加alpha通道

.alpha {
  /* 一个完全透明的颜色，等同于 transparent */
  color: rgba(0, 0, 0, 0);
  /* 一个完全不透明的颜色，等同于rgb */
  color: rgba(0, 0, 0, 1);
  /* 一个半透明的颜色 */
  color: rgba(0, 0, 0, 0.5);
}

rgba还可以有多种书写方式，例如rgba(0, 0, 0, 0.5)还可以写为：

  • rgb(0 0 0 / 50%)
  • #00000080

应用场景

  • 制作一个遮罩层：设置背景为background：rgba(0, 0, 0, 0.5)
posted @ 2023-07-31 13:22  HuangBingQuan  阅读(44)  评论(0)  编辑  收藏  举报