El diseño de su web: Fondos de CSS

El diseño de un sitio web es igualmente (si no más) importante que su funcionalidad y usabilidad. Es fundamental para el éxito de un sitio web para ser fuerte tanto visualmente como fundacionalmente.

Tomemos un momento para hablar de la Capilla Sixtina para ilustrar mi punto. La capilla fue construido para durar y es fundacionalmente sonido. Sin embargo, la capilla es famosa por el mero hecho de su funcionalidad. Tristemente célebre pintura de Miguel Ángel se basa en el techo de la capilla y deja a la mayoría en el temor de la belleza artística. El resultado de esta combinación es sencillamente una de las capillas más grandes del mundo.

Páginas web pueden existir apoyándose en la presencia ni la de gran diseño o el código fantástico, pero para los sitios web de prosperar, es esencial para combinar los dos.

En este post, me gustaría echar un vistazo a la parte importante del diseño y la ecuación de Codificación con CSS, más especificar las propiedades del fondo de CSS.

W3Schools define la propiedad CSS background como: "una propiedad resumida para el establecimiento de todas las propiedades de fondo en una declaración." Tenga en cuenta que la mayoría de los valores encontrados dentro de la propiedad de fondo puede ser utilizado como su propiedad. Los ejemplos a continuación sólo se utiliza la versión abreviada de la propiedad de fondo. Una desventaja de usar una abreviatura sólo es que no es muy bueno para la depuración o el descubrimiento de errores de ortografía

Comencemos por observar el valor más básico, que debería ser el primero en todas las propiedades de fondo: Color.

body {
background: #000000;
}

Mediante la sencilla Valor del color, un fondo puede ser muy simple y sencillo. Esta simplicidad puede ser beneficiosa para muchos sitios web. Tenga en cuenta que la técnica de excelente diseño no significa necesariamente que las imágenes llamativas y Web 2.0 biseles en todas partes. Además de los colores utilizados en las propiedades del fondo, también puede utilizar el valor de la transparencia. El valor de la transparencia se utiliza principalmente en fondos dentro del sitio tales como divs de sus mesas y no en un fondo común del cuerpo que se encuentran aquí.

El valor de color debe ser siempre un punto de anclaje dentro de su propiedad de fondo. Incluso si usted tiene una imagen en el fondo que se extiende por 1000 píxeles, todavía va a querer poner un valor de color detrás de él así que, si bien su imagen de fondo se está cargando el usuario no ve un fondo blanco rígido en su oscuro Niza sitio web.

A continuación, le permite hablar de otro valor de fondo importante, sobre todo en el mundo de la web de hoy, el fondo de la imagen.

body {
background: #000000 url(images/yourimage.jpg) repeat fixed top;
}

Las ideas pueden ser utilizados en una variedad de maneras diferentes, y en relación con valores como background-attachment, background-position y background-repeat. No hay fin a lo que usted puede hacer a su fondo del cuerpo. Mientras que usted puede poner una imagen en tu CSS sin necesidad de añadir estos otros valores, es esencial que los cuatro valores permanecen juntos.

Los ejemplos de arriba y de abajo muestran sólo algunas maneras que usted puede utilizar el fondo el valor de la imagen con la ayuda del fondo de valor de repetición. Fondos de simple estampado con el fondo de valor repetirá a repetir se ilustra arriba. Las versiones más complicada del valor que se establece en repeat-x se puede ver a continuación. Centrado en las imágenes se puede lograr estableciendo el valor a no repetir como el sitio web de Niza oscuro, el fondo de la repetición y la imagen de fondo apoyado por el background-position y background-valores afectivos ayuda para poner de relieve sus sitios de estilo.