javascript - 我们可以将水印文本设置为背景吗？

Question

我们可以将水印文本设置为水印的背景文本吗

<p style='position:fixed; color: #d0d0d0;font-size: 70pt;-webkit-transform: rotate(-45deg);-moz-transform: rotate(-45deg);left:center;'>Test Water mark</p>

如果我给z-index: -1，< p >文字不可见

Answer 1

如果背景定义为 0 或更高，则 -1 处的文本不可见。因此，要查看所有内容，您至少需要两个“层”：一个背景层（位于较低的 Z，例如 -1），它还将包含您的水印，以及一个较高的层（例如 0），它没有背景（或将具有非透明背景）并将包含您的前景。

我怀疑你所做的是有一个前景+背景元素，默认 Z 为 0；在这种情况下，您不能在它们之间插入水印，因为它们之间没有；所以你的水印要么覆盖前景，要么在背景后面（因此不可见）。

Answer 2

将以下给定样式添加到 <P> 标记

width: 600px;
    height: 600px;
    position: fixed;
    top: 50%;
    left: 50%;
    margin-left: -100px;
    margin-top: -100px;
    color: grey; 
    font-size: 50px; 
    zoom: 1; 
    opacity: 0.4; 
    filter: alpha(opacity=40);