Publicado por alvlin, el Con CSS se puede especificar el fondo de un elemento cualquiera, y sus propiedades.
Se puede especificar el color, la imagen que se usará, si esta imagen debe repetirse o no, y dónde debe ubicarse.
background-image : url(ruta a la imagen);
La imagen que se usará como fondo
background-repeat : repeat | no-repeat | repeat-x | repeat-y
Especifica si la imagen debe repetirse tanto vertical como horizontalmente.
- repeat hace que se repita en mosaico en ambos sentidos
- no-repeat hace que la imagen se muestre solo 1 vez
- repeat-x hace que la imagen se repita horizontalmente
- repeat-y hace que la imagen se repita verticalmente.
background-color : rgb(XXX,YYY,ZZZ) | #XXYYZZ | color
Especifica el color del fondo.
- rgb(XXX,YYY,ZZZ) Valores decimales para rojo, verde y azul
- #XXYYZZ valores hexadecimales (tal y como se usan en HTML)
- color uno de los 17 colores predefinidos en CSS.
background-attachment : scroll | fixed
Especifica si la imagen de fondo debe desplazarse o no con el texto (scroll la deja moverse, fixed la deja fija).
background-position
Especifica la posición en la que se ubica la imagen de fondo. La forma más fácil de especificarla es usando las palabras top (arriba), left (izquierda), right (derecha) y bottom (abajo). También pueden especificarse porcentajes, por ejemplo un valor de '15% 30%' ubicará la imagen de fondo (su esquina superior izquierda) con un "margen" izquierdo de 15% del ancho de la página, y un margen superior de 30% de la altura de la página. Otros valores más usuales son, por ejemplo 'top left', o 'bottom right'.
background
La forma corta, personalmente me parece difícil de recordar y más compleja que usar las propiedades "largas", pero existe. Sirve para especificar todas las propiedades del fondo en una sola línea:
background: background-color || background-image || background-repeat || background-attachment || background-position
No es necesario especificar todas las propiedades, lo siguiente es perfectamente válido:
background: white url(fondo.png);
Y tampoco es necesario especificar las propiedades en el orden mostrado, lo siguiente también es válido (ejemplo mostrado en el sitio del W3C):
background: url("chess.png") gray 50% repeat fixed
