html页面打水印效果

body{
position: relative;
}

body::after {
content: “”; /* 水印文字 /
position: fixed;
top: 0;
left: 0;
bottom: 0;
right: 0;
z-index: 9999;
pointer-events: none; / 允许点击穿透 */

/* 文字样式 */
color: rgba(0, 0, 0, 0.1); /* 半透明 */
font-size: 24px;
font-weight: bold;/* 旋转和布局 */
transform: rotate(20deg);
transform-origin: center center;
display: flex;
align-items: center;
justify-content: center;/* 重复水印效果 */background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="200" height="200" viewBox="0 0 200 200"><text x="0" y="100" font-family="Arial" font-size="20" fill="rgba(0,0,0,0.1)" transform="rotate(-30)">星哥要的水印</text></svg>');

}