css - 是否可以屏蔽一个，或者用蒙版图像覆盖文本？

Question

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

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

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

谢谢你的帮助。

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/