background-image

Artículo
10/11/2017

Establece la imagen de fondo del objeto.

Sintaxis

{ background-image: sLocation }

Valores posibles

sLocation

Cadena que especifica uno de los valores siguientes:

none	Valor predeterminado. Color del siguiente elemento primario a través del que es visible el fondo.
url(sUrl)	Ubicación de la imagen de fondo, donde sUrl es una dirección URL absoluta o relativa.

Esta propiedad tiene el valor predeterminado none . No se hereda.

Observaciones

La dirección URL identifica el archivo de imagen. Al establecer una imagen de fondo, puede configurar el color de fondo que se usará cuando no esté disponible la imagen. Cuando la imagen esté disponible, se superpondrá sobre el color de fondo.

Esta propiedad se puede establecer con otras propiedades de fondo mediante la propiedad compuesta background .

Ejemplos

En el siguiente ejemplo se usa la propiedad background-image para especificar la imagen de fondo. Se utiliza una llamada a una hoja de estilo incrustada (global) para mostrar y ocultar la imagen de fondo:

<style>
    .setUrl  { background-image: url(sphere.jpg); }
    .loseUrl { background-image: url(none); }
</style>
</head>
<body>
<span style="font-size: 14;" onmouseover="this.className='setUrl'" onmouseout="this.className='loseUrl'">
. . . 
</span>

Información sobre estándares

Esta propiedad se define en la especificación Cascading Style Sheets (CSS), Level 1 (CSS1) (Hojas de estilos en cascada (CSS), nivel 1 (CSS1)) Ee371196.xtlink_newWindow(es-es,Expression.40).png .

Aplicable a

a, address, b, big, blockquote, body, button, caption, center, cite, code, col, colgroup, custom, dd, defaults, dfn, div, dl, dt, em, fieldset, form, hn, html, i, iframe, img, input type=button, input type=checkbox, input type=file, input type=image, input type=password, input type=radio, input type=reset, input type=submit, input type=text, li, ol, option, p, s, select, span, sub, table, tbody, td, tfoot, th, thead, tr, tt, u, ul, var, xmp

Vea también

Conceptos

background
background-color
background-position
background-repeat

Compartir a través de