Cómo utilizar dos colores como fondo en un sitio web

El color de fondo de una página web sin ninguna personalización es blanco. El lenguaje de programación HTML web le permite cambiar el color de fondo y agregar una imagen de fondo. Puede usar una imagen para mostrar un fondo que presenta varios colores. Use una imagen existente que muestre los dos colores que desea, como los del logotipo de su empresa, o cree uno con un editor de gráficos. Puede crear un fondo de dos colores para su página web utilizando una imagen horizontal delgada que se repite. Use hojas de estilo en cascada para hacer los cambios en todo el sitio.

1.

Abra un editor de texto o HTML para crear la hoja de estilo externa que contendrá su estilo de fondo CSS.

2.

Escriba una definición de estilo para el fondo en la etiqueta del cuerpo. Las definiciones de estilo toman la forma de "etiqueta {}", por lo que una definición para la etiqueta del cuerpo sería "cuerpo {}". CSS proporciona varios parámetros que le permiten definir su estilo. La propiedad "imagen de fondo" le permite indicar una imagen para su fondo. Incluir un enlace para la imagen en el parámetro "url". Por ejemplo, el código podría verse así:

cuerpo {imagen de fondo: url (images / 2colors.jpg); }

3.

Escriba un valor que indique al fondo que se repita verticalmente - "repetir-y" - u horizontalmente - "repetir-x" - usando la propiedad "fondo-repetir". Esta propiedad le permite establecer parámetros para personalizar la manera en que se repetirá su imagen. El estilo del cuerpo se asemejará a esto:

cuerpo {imagen de fondo: url (images / 2colors.jpg); Repetición de fondo: repetir y; }

4.

Guarde el archivo con una extensión ".css", por ejemplo, pagestyles.css.

5.

Abra una página web a la que desea aplicar el estilo de fondo. Los enlaces a documentos externos se establecen dentro del conjunto de etiquetas "" de su página web. Localice la etiqueta “” e inserte el siguiente texto sobre ella para proporcionar acceso a la hoja de estilo:

6.

Repita la codificación del enlace en cada página de su sitio web donde desee utilizar el fondo de la imagen. Pruebe el resultado de sus cambios cargando la página en un navegador web.

Entradas Populares