css的mix-blend-mode属性生成水印效果，不影响文本及点击事件

.test {
        /* 设置全屏宽高，覆盖于页面上方 */
        position: fixed;
        top: 0;
        left: 0;
        height: 100vh;
        width: 100vw;
        opacity: 0.8;
        /* 生成的图片是有一张，开启repeat自动填充 */
        background: repeat;
        pointer-events: none;
        /* 核心部分，决定水印层与内容部分的结合方式 */
        mix-blend-mode: multiply;
      }