Подскажите, как реализовать эффект вырезания изображения по тексту

Question

[Александр Баумгертнер]

Подскажите, как можно реализовать такой эффект:



Нужно показать картинку только в буквах шрифта.

Спасибо!

Answer 1

[Alexander]

Оно?
www.myadzel.ru/tests/html/text-background/

Comments

[Александр Баумгертнер]

Спасибо, попробую!

Answer 2

[Cyapa]

{
    background-image: url("image.png");
    background-clip: text;
    -webkit-background-clip: text;
    -mox-background-clip: text;
    -ms-background-clip: text;
    -o-background-clip: text;
}

Только это очень уж не кроссбраузерно, к сожалению.

Comments

[Александр Баумгертнер]

Спасибо! Попробую совместисть с js для кросс-браузерности

Answer 3

[Александр Баумгертнер]

www.silenceit.ca/2011/03/11/css-gradients-and-webkit-image-masks-on-text/

а так же и анимация:
www.silenceit.ca/2011/03/25/css-text-mask-animation/