-
Fond texte image
Un code qui, dans cette écriture, ne fonctionne qu'avec les navigateurs webkit (Chrome,Opéra, Safari...); pour Firefox, il faut adopter une autre écriture.
Comment mettre une image, animée ou non, en fond de texte; ce texte sera assez gros, pour que l'effet soit bien visible.FALL
FALL
FALL
Code du premier montage; les autres ont juste l'adresse de l'image différente; pour le troisième, avec texture, modifier background-repeat:repeat; et background-size:auto;
<div id="mont">
<h3>FALL</h3>
</div>
<style type="text/css"><!--
#mont{
text-align: center;
max-width: 800px;
margin: 0 auto;
font-size: 250px;
line-height: 250px;
-webkit-text-fill-color: transparent;
-webkit-text-stroke: 2px rgba(0,0,0,0.5);
font-family: 'Gravitas One', 'Arial Narrow', Arial, sans-serif;
background-image: url(http://ekladata.com/gNTQrOPjyyMBxSUgQADO7TdfQPA/DSCN6127.gif);
background-repeat: no-repeat;
background-position: center center;
background-size: 100%;
-webkit-background-clip: text;
-webkit-filter:drop-shadow(10px 10px 10px black);}
--></style>
...