Un fondo que coincide y se mezcla suavemente con el diseño y el contenido es clave para hacer un sitio web de aspecto profesional. Para lograr esto, el posicionamiento correcto puede ser necesario. El atributo fondo cuerpo HTML está en desuso a fin de utilizar las hojas de estilo en lugar de dar formato a sus imágenes de fondo. Con los estilos CSS, usted está en control total de la forma en que las imágenes aparecen y se comportan en sus páginas Web.
posicionamiento
Un documento HTML puede tener una imagen de fondo para toda la página, así como para los elementos específicos en la página, como una mesa. estilos CSS pueden formatear estas imágenes de fondo de varias maneras. Estilos describen efectos y atributos como el nombre del archivo de origen de la imagen, la frecuencia con la que la imagen se repite en la página y la posición de la imagen en el documento.
Sintaxis
Para establecer la posición y alineación de una imagen de fondo, que tendrá que utilizar varias propiedades de fondo CSS, cada uno de los cuales controla un atributo específico. Debe utilizar el elemento que la imagen se utiliza para que el selector en la hoja de estilo. Por ejemplo, si el fondo que desea alinear es la imagen de fondo principal, utilice el "cuerpo" como selector, ya que corresponde con la etiqueta <body> en HTML.
La estructura es la misma que todos sintaxis CSS:
{selector de propiedad: valor;}
donde "selector" es el elemento HTML, "propiedad" es el atributo o el efecto y el "valor" es la información de ese atributo.
propiedades
Cada propiedad CSS fondo tiene su propia función específica. La propiedad background-imagen se utiliza para llamar al archivo de imagen específica. La propiedad background-repeat determina el número de veces que se repite en la página. Para decidir si la imagen "flota" sobre la página o "palos" a ella como el usuario se desplaza a la página, utilizar background-attachment. Para ajustar la alineación de la imagen, utilice la propiedad background-position. Tenga en cuenta que background-position se puede marcar en formato de texto, como el "centro", "arriba a la izquierda", etc .; como porcentaje; como unidades; o como "hereda" - lo que significa que va a utilizar la misma posición que otro elemento HTML que lo contiene. Para establecer una imagen en el centro de una página, puede utilizar "centro centro", "centro" o "50% 50%".
Ejemplos
Una imagen de fondo está formateado con estilos CSS que se incrustan entre las etiquetas <head> de un documento HTML. Si está marcado en una hoja de estilos externa, eliminar el código que tiene las flechas.
En este ejemplo, la imagen de fondo se coloca en el centro de la página. Se pone a "no repetir" lo que la imagen aparece sólo una vez, no en mosaico como un patrón. El fondo se "fija" - si se mueve hacia arriba o hacia abajo o de lado a lado en la página, que permanecerá en el mismo lugar en la pantalla, como si flotara. Por ejemplo, si hay texto en la página, el texto se moverá, pero el fondo no lo hará. Si desea que la imagen se mueva con el resto de la página en lugar, entrar en "scroll" en lugar de "fijo" para el background-attachment.
<Head> <style type = "text / css">
cuerpo
{
Imagen de fondo: URL ( 'company.gif');
background-repeat: no-repeat;
background-attachment: fija;
background-position: center;
}
</ Style> </ head>