Color y background

Estas propiedades describen el color y fondo de un elemento, por ejemplo, el color del texto (color, foreground color) y el color del fondo (background-color).

La propiedad background permite asignar como fondo un color o una imagen. Tambien permite determinar el posicionamiento de la imagen; si ha de repetirse y como; y si se desplazará con el texto en caso de scroll o permanecerá fija.

'color'

Esta propiedad describe el color de un elemento. Hay varias formas de identificar el color: por su nombre, cuando está admitido en el standard; o por su valor RGB:
Todo es rojo:

em { color: red; }
em { color: rgb(255,0,0) }
em { color: #FF0000; }

•   aqua
•   black
•   blue
•   fuchsia
•   gray
•   green
•   lime
•   maroon
•   navy
•   olive
•   purple
•   red
•   silver
•   teal
•   white
•   yellow

El atributo color asigna al texto un color, especificado por su nombre o valor RGB. Se pueden designar los 16 colores arriba representados por su nombre (es la lista básica que todo navegador entenderá, pero hay muchos mas colores que pueden indicarse por su nombre), o especificar cualquier otro con su valor hexadecimal (RGB, red green y blue).

'background-color'

Con CSS y la propiedad background-color podemos controlar el fondo de cualquier elemento HTML, no solamente la propia página o las celdas de una tabla.. Mediante esta propiedad podemos decidir si asignamos un color o una imagen; el modo en que esta ha de repetirse o no; si se desplazará con la página o permanecerá fija.

Podemos especificar un 'color' de fondo para cualquier elemento con background-color : color, o asignar un valor 'transparent'.
Es muy recomendable que si especificas el background para un elemento, especifiques tambien su color, para evitar sorpresas con otros estilos declarados o heredados.

'background-image'

Podemos especificar una imagen de fondo, indicando su direccion por medio de una url, o señalar que no hay ninguna (none). Cuando se especifica una imagen de fondo es también conveniente especificar un color de fondo alternativo.
Ejemplo:

body { background-image: url(/imagenes/fondo.gif) }

Fijate que por defecto salvo contraorden la imagen se repite para ocupar todo el fondo del elemento ... en este caso todo el BODY

'repeat'

Por medio del parámetro background-repeat y sus valores: repeat, repeat-x, repeat-y, no-repeat podemos determinar si la imagen de fondo ha de repetirse (si no ocupa toda la pantalla), y la forma de hacerlo. 
Si se especifica 'repeat', la imagen se repetirá horizontal y verticalmente. Los valores 'repeat-x' y 'repeat-y' hacen que la imagen se repita horizontal o verticalmente, respectivamente, creando una banda de imagenes de un lado a otro.
Con el valor de 'no-repeat', la imagen no se repite.

body { background: red; url(fondo.gif); 
background-repeat:repeat-y; }

'background-attachment'

Valores: scroll, fixed.

Si se especifica una imagen de fondo, el parámetro 'background-attachment' especifica si permanecerá fija o acompañará al contenido si deslizamos la página con la barra de scroll.

body {
background: red url(fondo.gif);
background-repeat: repeat-y;
background-attachment: fixed;
     }

'background-position'

La propiedad background-position controla la ubicación inicial de la imagen, utilizando los valores top, left, right, bottom y center. Tambien admite valores absolutos, y porcentajes
La forma más sencilla de asignar una ubicación de fondo es con palabras clave:

Palabras clave horizontales (left, center, right)
Palabras clave horizontales verticales (top, center, bottom)
También pueden usarse porcentajes y longitudes para asignar la posición de la imagen de fondo. Los porcentajes son relativos al tamaño del elemento.

Al usar porcentajes o longitudes, la posición horizontal se especifica primero, seguida de la posición vertical. Un valor como 20% 65% especifica que la imagen se colocará 20% a la derecha y 65% abajo del elemento. Un valor como 5px 10px especifica que la esquina superior izquierda de la imagen se colocará 5 pixels a la derecha y 10 pixels abajo de la esquina superior izquierda del elemento.

Si solo se da el valor horizontal, la posición vertical será 50%. Se permiten combinaciones de longitudes y porcentajes, ya que son posiciones negativas. Por ejemplo, 10% -2cm está permitido. Sin embargo, porcentajes y longitudes no pueden combinarse con palabras clave.

Las palabras clave son interpretadas como sigue; 

top left = left top = 0% 0% 
top = top center = center top = 50% 0% 
right top = top right = 100% 0% 
left = left center = center left = 0% 50% 
center = center center = 50% 50% 
right = right center = center right = 100% 50% 
bottom left = left bottom = 0% 100% 
bottom = bottom center = center bottom = 50% 100% 
bottom right = right bottom = 100% 100% 

'background'

Valores: background-color, background-image, background-repeat, background-attachment, background-position.

Se trata simplemente, de la posibilidad de especificar todos los valores del background en una sola propiedad, de forma similar a lo que ocurría con 'fonts'.