Alguna vez habeis usado un fondo Grunge en vuestros proyectos?.
Pues este truco os va a encantar, porque con CSS podremos hacer que las letras de un titular por ejemplo tenga un fondo Grunge, tal y como lo veis en la imagen.
Con unos sencillos pasos podremos lograrlo facilmente con cualquier fondo que deseemos:
- Crear una imagen transparente PNG. Estos fondos, se pueden hacer descargardonos pinceles de páginas completamente gratis como en: Free Grunge Style Brushes
- Crear nuestro código HTML:
[html]
This is one very long title with grunge effect
[/html]
- Crear el código CSS:
[css]h1 {
position:relative;
color:#aeef33;
font-family: Georgia;
}
h1 span{
position:absolute;
display:block;
top:0;
left:0;
height:100%;
width:100%;
background:url(‘grunge.png’);
}[/css]
Para ver el tutorial más detallado podeis entrar en esta web