问题描述
提琴表明问题所在：https://jsfiddle.net/0z6ybe5p/
是否可以将Alpha蒙版应用于元素（在本示例中为<div>），以便在存在另一个元素（<span>）的地方将其剪切？我希望背景图片在<span>文字周围的矩形中可见。
解决方法
Codepen
可能，但是需要间接解决方案。通过使用clip-path属性，我们可以将#target显示为框架，然后将<h1>居中，但这需要进行一些更改。
首先-我们需要将<h1>的}兄弟姐妹不再是孩子。
#target 第二-将<body>
<div id=target></div>
<h1 id="clipper">CLIP HERE</h1>
</body>
属性添加到clip-path。您可以使用一些值来使它看起来更好，甚至可以使用#frame之类的无响应单元。 Here是Bennett feely的一个非常好的在线编辑器的链接。
pxbody {
margin: 0;
background-image: url('https://picsum.photos/400/200');
}
#target {
position: fixed;
width: 100%;
height: 100%;
background-color: gray;
clip-path: polygon(0% 0%,0% 100%,25% 100%,25% 25%,75% 25%,75% 75%,25% 75%,100% 100%,100% 0%);
}
#clipper {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
}
依赖报错 idea导入项目后依赖报错，解决方案：https://blog....
错误1：gradle项目控制台输出为乱码 # 解决方案：https://bl...