CSS – Remplazar un bloque de texto con una imagen

mayo 7, 2012

En el diseño de páginas web es muy útil colocar bloques o contenedores para indicar el lugar que va a ocupar un elemento de nuestro diseño. Y es mucho más práctico el poder remplazar dicho bloque desde nuestra hoja de estilos. De esta forma podemos modificar el diseño sin tener que cambiar la estructura o el código html de nuestra página.

En ésta página nos muestran nueve formas diferente de realizar esto. Pero mi favorita es, sin duda, la técnica número 3.

HTML


<h1 class="technique-three">

CSS-Tricks

</h1>

CSS


h1.technique-three {

width: 350px; height: 75px;

background: url("images/header-image.jpg");

text-indent: -9999px;

}

Anuncios

Una respuesta to “CSS – Remplazar un bloque de texto con una imagen”

  1. nathan Says:

    Reblogged this on Nathan.


Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s

A %d blogueros les gusta esto: