Watermark 水印

文档: https://vant-contrib.gitee.io/vant/#/zh-CN/watermark

一个绝对定位的层, 配置水印后, 会覆盖所谓容器的顶层 (注意, 采用绝对定位, 容器需要 relative).

水印可以是文字, 一个图片, 也可以是一段 HTML.

<van-watermark content="水印内容"></van-watermark>

常用属性:

• content 文字水印.
• 组合 image 和 opacity 来实现图片水印.
• 使用 gap-x, gap-y, 和 rotate 来控制水印间的间隔与倾斜角度 (默认为 -22).
• full-page 控制水印是否显示在整个页面.
• HTML 水印使用 content 插槽来定义.

水印类样式:

.van-watermark {
  position: absolute;
  height: 100%;
  width: 100%;
  left: 0;
  top: 0;
  z-index: var(--van-watermark-z-index);
  background-repeat: repeat;
  pointer-events: none;
}