css 将遮挡层的文字变亮

CSS是一种用于网页排版的语言，它可以让我们轻松地对网页中的元素样式进行美化。在很多场景下，我们可能需要使用遮挡层把一些内容遮住，但因为遮挡层本身是一个半透明的黑色区块，所以背景颜色较暗的文字可能会看不清。这时可以利用CSS的filter属性将遮挡层上的文字颜色变亮。

.overlay {
      background-color: rgba(0, 0, 0, 0.5);
     /* 半透明黑色 */  position: fixed;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
}
.overlay p {
      filter: brightness(150%);
 /* 将文字颜色变亮150% */}
    

在上述代码中，我们首先定义了一个遮挡层，其CSS class为.overlay。由于它采用了定位属性为fixed，将这个遮挡层定位在了整个页面的最上层。然后在.overlay p的样式设置中，通过CSS的filter属性将文字颜色变亮，实现了遮挡层上的文字更加清晰可见。

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！