Outbook

HTML+CSS+JS, Accesibilidad, PHP y más

Inicio que contiene a background-position

Datos de búsqueda

Etiqueta ‘background-position’

CSS sprites (2): posicionamiento de la imagen de fondo

Fecha de publicación: 2007/09/18

Este artículo es una ampliación a CSS Sprites: rollover utilizando una sola imagen.

En el artículo anterior se daban valores negativos para el eje de coordenadas Y en la propiedad CSS background-position. En este caso el valor se puede obtener de la siguiente forma: se resta a la altura total de la imagen la altura del sprite que se quiere ver y la coordenada Y de la propiedad background-position.

Ejemplo: la altura total de una imagen con 2 sprites es de 100px. Cada sprite tiene una altura de 6px, y el sprite que está inicialmente tiene un background-position:0 4px;. Entonces se hará la siguiente resta: 100px-6px-4px=90. La posición del eje Y que habrá que dar será -90px.

Datos del artículo:

CSS: background-position ¿Qué orden llevan los valores?

Fecha de publicación: 2007/05/03

Cuando se ponen dos valores numéricos pueden surgir dudas de cual es el vertical y cual el horizontal:

background-position: X Y;

La X sería el valor horizontal, y la Y el valor vertical. Siempre que sean medidas con valores numéricos.

Si se trata de valores no numéricos (left, right, bottom, top) da igual el orden.

Saber más:

Datos del artículo:

Información del sitio