background-color
: define el color de fondo.background-image
: define la imagen de fondo.background-position
: define la ubicación de la imagen de fondo.background-repeat
: define si se repite la imagen de fondo horizontal y verticalmente.background-attachment
: define si la imagen se mantiene fija o se desplaza con la página.background-color
#0000FF
) o RGB (p.e. rgb(255, 0, 0)
).background-image
background-repeat
background-repeat
que recibe las opciones:no-repeat
: no repetir horizontal ni verticalmente.repeat-x
: repetir solo horizontalmente.repeat-y
: repetir solo verticalmente.background-position
background-repeat
es no-repeat
.background-position
recibe dos valores: la posición vertical y horizontal.background-position
pueden ser una posición en palabras (p.e. top left), un porcentaje o una posición en pixeles u otra unidad.background-size
background-size
nos permite cambiar el tamaño de la imagen de fondo.background-size
puede recibir dos valores: el ancho y el alto en porcentaje, pixeles o alguna otra unidad. Por ejemplo:background-size
también puede recibir dos valores especiales:cover
: la imagen se estira hasta que ocupe todo el área del elemento.contain
: la imagen se estira hasta que el alto o el ancho ocupen el alto o ancho del contenedor.background-attachment
background-attachment
nos permite cambiar ese comportamiento y dejar la imagen fija cuando la página se desplace creando un efecto interesante:background
background
. Por ejemplo:background-color
, background-image
, background-position
/background-size
, background-repeat
y background-attachment
.