html实现网页添加自定义水印内容
在HTML页面中添加自定义水印内容，可以通过在页面上叠一个透明的层，在这个层上绘制水印文字。以下是一个简单的HTML和CSS示例，实现了这个功能：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Custom Watermark</title>
<style>
body {
position: relative;
min-height: 100vh;
margin: 0;
font-family: Arial, sans-serif;
}
.watermark {
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%) rotate(-45deg);
transform-origin: 50% 50%;
z-index: 1000;
font-size: 5em;
color: rgba(0, 0, 0, 0.1);
user-select: none;
pointer-events: none;
}
</style>
</head>
<body>
<div class="watermark">Watermark Text</div>
<!-- Your page content goes here -->
</body>
</html>在这个示例中，.watermark 类定义了水印的样式，包括位置、旋转、字体大小和颜色。水印文字“Watermark Text”会显示在页面上，但不会影响页面的功能，用户可以点击或选中它。通过调整.watermark类的样式属性，你可以自定义水印的外观和感觉。
评论已关闭