SummArg | Cursos y recursos para webmasters

23/11/2010

Colocar una imagen como fondo de texto sólo con CSS

En El Webmaster hablaron de cómo utilizar una imagen para rellenar texto con CSS3, además de ofrecernos el modo para que todos los navegadores. Por el momento sólo se encuentra disponible para navegadores webkit. Tras seleccionar la imagen para colocar como fondo de nuestro texto, se debe completar el CSS como sigue:

h1 {
color: white;  /* Fallback: assume this color ON TOP of image */ background: url(images/fire.jpg) no-repeat; -webkit-background-clip: text; -webkit-text-fill-color: transparent; }

Para el caso de los usuarios que no utilicen navegadores webkit, habrá que utilizar modernizr y especificar cómo debe completarse el fondo de la tipografía en tal caso (colocando un color plano tal vez).

Dejar un comentario