| Definición | Establece el color de fondo de un elemento |
|---|---|
| Valores permitidos | Uno y sólo uno de los siguientes valores: |
| Valor inicial | transparent |
| Se aplica a | Todos los elementos |
| Válida en | medios visuales |
| Se hereda | no |
| Definición en el estándar | w3.org/TR/CSS21/colors.html#propdef-background-color |
Ejemplos de uso
La propiedad background-color se emplea para establecer el color de fondo de un elemento mediante cualquiera de las diferentes formas de indicar un color en CSS:
El color de fondo se muestra en la zona que ocupan el contenido y el relleno del elemento, justo hasta su borde.
El valor por defecto de esta propiedad es transparent. Cuando un elemento tiene un fondo de color transparente, se ven los colores de fondo y/o imágenes que tengan establecidos los elementos en los que se encuentra. Si el elemento no está encerrado por ningún elemento, se ven los colores de fondo y/o imágenes de la página web.
En el siguiente ejemplo, se fuerza a que la caja interior tenga un color de fondo transparente, de modo que se ve el color de fondo de la caja que la encierra:
Las posibilidades de background-color son bastante limitadas, ya que sólo permite mostrar colores sólidos. Por lo tanto, no es posible utilizar diferentes niveles de transparencia en el color o crear degradados con varios colores.
Si quieres utilizar efectos avanzados como fondo de un elemento, es necesario utilizar la propiedad background-image sola o combinada con la propiedad background-color.