2014-01-30 87 views
0

所以,我編寫了一些東西,然後想到了我的想法。我無法瞭解它的底部,並找出如何去做,所以我希望別人也有興趣。 :)帶CSS的文本軌跡遮罩

是否有可能在CSS中使用文本進行Track Matte(如後效應)。所以剪下一個div的文本來查看底部div的背景。就像這樣:

text track matted

它甚至有可能只與代碼做到這一點,而無需使用圖像。所以,謝謝,最好的問候。

+0

的http:// css-tricks.com/image-under-text/ – j08691

+0

This arti cle也很有趣:http://tympanus.net/codrops/2013/12/02/techniques-for-creating-textured-text/ – davidgnin

回答

0

沒錯,但只針對webkits

有趣的是,也:
http://www.hongkiat.com/blog/css-masking/

.backgroundclip h1 { 
    -webkit-text-fill-color: transparent; 
    -webkit-background-clip: text; 
    background: url(http://bit.ly/1hRsB2d) no-repeat; 
} 

h1 { 
    color: red; 
} 

演示(如在評論)上:
http://css-tricks.com/examples/ImageUnderText/

+2

不幸的是,它只能在webkit瀏覽器中工作:( –

+0

所以這可以做到這一點,儘管它只適用於-webkit-s,但嘿,它的工作原理。這裏是小提琴的[鏈接](http://jsfiddle.net/DCbgc/)。 –