Question

我几乎可以肯定这是不可能的，但只是想问我是否正确。

我有一个背景颜色为实色的容器，里面有文字。这漂浮在图像上。目前，文本颜色是黑色，但我想要的是文本变得透明，这样我就可以看到背景颜色和背后的图像。我知道这听起来不可能，所以我认为如果我用相同的图像覆盖文本但是以某种方式掩盖它只能覆盖文本的部分是可见的，我可以达到同样的效果。

我希望很清楚我的意思。如果有人知道如何做到这一点，我会很高兴，如果不能做到，请指出一些证据，说明为什么不能这样做：）

感谢您的帮助。

Answer 1

基于webkit的浏览器中有一个名为-webkit-background-clip: text的属性。写得像这样：

p{
    background-image:;
    background:  url(http://2.bp.blogspot.com/-NSwhl6hv41Y/Th5EIJL_zZI/AAAAAAAAFc4/UGUNfb--tGc/s1600/vector_wallpaper_by_seppoftw.jpg);
    -webkit-background-clip: text; 
    -webkit-text-fill-color: transparent;
    font-size:100px;
    margin:40px;
}

选中此http://jsfiddle.net/yvYG8/

阅读此内容以获取更多http://trentwalton.com/2011/05/19/mask-image-text/

是否可以屏蔽<div>，或使用蒙版图像覆盖文本？</div>

1 个答案: