IMAGEN DE FONDO EN CSS

Al colocar una imagen de fondo es interesante saber que se puede dejar estática. Esto quiere decir que no se mueve con el documento y que puedes hacerlo un poco a tu antojo (haciendo que la imagen sólo esté en media página, que sólo aparezca una vez evitando la cascada...)

Veamos la sintaxis:
BACKGROUND: url(http://direccion-de-tu-imagen) #000000 fixed repeat-x 50% bottom

- #000000 -
¿Porqué se pone color al fondo si ya he colocado la imagen?
.-Hay veces que no se carga bien la imagen, conviene definir un color de fondo por si esto fallase. También nos sirve para tener un color de fondo en el caso de que la imagen no ocupe todo el documento.

- fixed -
Esto hace que la imagen quede estática.

- repeat-x 50% bottom-
Repeat hace que la imagen se repita. X es una coordenada a la que le hemos dado como valor 50% Lo que quiere decir que la imagen sólo ocupará el 50% de la página en horizontal.
La palabra "bottom" indica qué parte del porcentage llevará la imagen. Del centro hacia arriba? o del centro hacia abajao?
Bottom es del centro hacia abajo, para hacerlo hacia arriba hay que poner top

Ejemplo:
BACKGROUND: url(http://direccion-de-tu-imagen) #000000 fixed repeat-x 50% top

Poner como valor Y el porcentage seria en vertical, pero hay que tener en cuenta que si colocamos la Y hay que cambiar la palabra "bottom" por izquierda o derecha.

Ejemplo sintaxis con Y:
BACKGROUND: url(http://direccion-de-tu-imagen) #000000 fixed repeat-y 50% left

- left -
Sería izquierda

- right -
Sería derecha