好的,这是可能的.
我有一个背景图像.最重要的是,我有一个透明的灰色框内容.我想在文字顶部有标题,这基本上是暴露背景的字母.所以,文字会移除灰色框,让背景显示出来.
我唯一可以看到的奇怪的方式是创建一个图像,字母在背景上透明一样的灰色,然后尝试以某种方式与灰色框对齐.
还有另一种 – 更好的方式吗?
解决方法
一种方法是使用-webkit-background-clip:text;:
demo here(仅显示webkit).
使用位置,我们可以同步两个背景:
#container,#container h1 { background: url(bg.png) } #container { position: relative; } #container #gray { background: rgba(0,.8); padding-top: 8em; } #container h1 { font-size: 8em; padding-top: /* padding + border of div */; position: absolute; -webkit-text-fill-color: transparent; -webkit-background-clip: text; }
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。