css设置遮罩层(半透明）

在CSS中，可以使用rgba颜色格式来设置半透明的遮罩层。rgba代表红绿蓝三色加上alpha通道（透明度）。

以下是一个简单的例子，创建一个全屏的半透明遮罩层：

HTML:




<div class="mask"></div>

CSS:




.mask {
  position: fixed; /* 定位方式 */
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5); /* 黑色半透明遮罩层 */
  z-index: 1000; /* 确保遮罩层在其他内容之上 */
}

在这个例子中，.mask 类创建了一个全屏的遮罩层，背景颜色设置为黑色半透明（rgba(0, 0, 0, 0.5)），其中最后一个值（0.5）是透明度，可以根据需要调整为其他介于0（完全透明）和1（完全不透明）的值。

css设置遮罩层(半透明）

评论已关闭

推荐阅读