Cómo Configurar Un Fondo En Un Sitio Web

Tabla de contenido:

Cómo Configurar Un Fondo En Un Sitio Web
Cómo Configurar Un Fondo En Un Sitio Web

Video: Cómo Configurar Un Fondo En Un Sitio Web

Video: Cómo Configurar Un Fondo En Un Sitio Web
Video: Tutorial Como Poner Una Imagen De Fondo En HTML 2024, Mayo
Anonim

El diseño de cualquier sitio se basa en imágenes y colores de fondo, como una casa sobre una base. Si desea reemplazar la base típica de su recurso de Internet con algo más individual, debe comenzar con el desarrollo del diseño. Y cuando esté listo, quedará la parte puramente técnica, es decir, reemplazando el diseño antiguo del fondo del sitio especificado en el código fuente de las páginas por el nuevo. Hay varias formas de implementar esto en la práctica.

Cómo establecer un fondo en un sitio web
Cómo establecer un fondo en un sitio web

Instrucciones

Paso 1

Primero debe averiguar cuál de las formas en que se establece el fondo en la versión actual del sitio. Para hacer esto, abra el código HTML de la página. Puede hacer esto con un editor de texto simple descargando el archivo del servidor con anticipación. O puede utilizar el editor de páginas del sistema de gestión de contenido, si utiliza uno. El editor de páginas no requiere descargar el archivo, pero lo modifica directamente en el servidor usando el navegador como interfaz El código HTML (Lenguaje de marcado de hipertexto) de la página que abre consiste en líneas de instrucciones para el navegador. Describen los tipos, apariencia y ubicación de cada uno de los elementos de una página web. Estas instrucciones se denominan comúnmente "etiquetas". El orden de las etiquetas en el código de la página también obedece a las reglas del lenguaje HTML: se dividen en bloques, el primero de los cuales debe ser un bloque de encabezado que comienza con una etiqueta y termina. Debería ir seguido del bloque que más le interese ahora: el cuerpo del documento. Está limitado a etiquetas y. En la etiqueta de apertura de este bloque (), puede poner información sobre el fondo de la página. Esta información dentro de las etiquetas se denomina "atributos". El atributo de la etiqueta del cuerpo que establece el color de fondo se denota como bgcolor y en el código podría verse así: Aquí establecemos el color de fondo de la página en plateado. El navegador puede reconocer algunos colores por sus nombres, pero para no equivocarse, es mejor indicar sus códigos hexadecimales. Esta versión con color plateado en expresión hexadecimal se verá así: Por lo tanto, debe buscar la etiqueta que comienza con <cuerpo en el código de la página y verificar si tiene un color de fondo. Si es así, reemplace la indicación de color con su nueva versión y guarde los cambios en la página.

Paso 2

El fondo del diseño actual de su sitio no se puede establecer por color, sino por una imagen. El atributo correspondiente de la etiqueta del cuerpo se llama fondo, y puede verse así en el código: Aquí, el fondo es la imagen bg.jpg

Paso 3

Cuando describa la apariencia de páginas con un diseño relativamente complejo, use "hojas de estilo en cascada" - CSS (Hojas de estilo en cascada). Los bloques de código CSS se pueden incluir directamente en el código de la página o en un archivo externo con la extensión "css". Debe buscar la etiqueta de descripción de estilo que comienza con <style en la parte del encabezado del código de la página (entre las etiquetas y). Si contiene un enlace a un archivo externo, se verá así: @import "style.css"; Aquí hay un enlace a una hoja de estilo llamada style.css. Debe abrir el archivo especificado para editarlo. Y si no hay un enlace, y después de la etiqueta de estilo <de apertura hay instrucciones de estilo, entonces debe editarlas aquí. En ambas opciones, entre las descripciones de estilos, debe buscar las relacionadas con el cuerpo del documento (body). Este bloque de descripciones puede verse así: cuerpo {

color de fondo: Plata;

de color negro;

} Aquí necesita reemplazar el valor del parámetro background-color con el valor de su nuevo color y mejor en los mismos valores hexadecimales. La opción de imagen de fondo en las instrucciones CSS debería verse así: body {

fondo: # C0C0C0 url (img / bg.jpg) repeat-y;

de color negro;

} Aquí el enlace a la imagen es similar al que se discutió anteriormente, y # C0C0C0 antes del enlace significa que el espacio de la página que no está ocupado por la imagen de fondo tendrá un fondo plateado. "Repeat-y" indica que la imagen de fondo debe multiplicarse a lo largo del eje Y (vertical)."Repeat-y" se puede reemplazar por "repeat-x" (replicación horizontal) o "no-repeat" (no replicar). Si no especifica la repetición en absoluto, la imagen de fondo se colocará en mosaico en el espacio de fondo de la página en todas las direcciones.

Recomendado: