Tecnología

Inicio

Cómo poner un bar o separadores en una página web

October 1

Hay un número de maneras de colocar barras o separadores en los sitios web. Un método que está integrado directamente en código HTML en sí es bastante fácil, siempre y cuando usted es capaz de editar el código HTML de su sitio. Con separadores, se hace muy fácil de organizar su contenido con claridad, lo que mejorará la legibilidad de su sitio web.

Instrucciones

Pasos

1 Abrir el código fuente de la página que desea editar. Si ejecuta su sitio web a través de una interfaz de usuario (en un blog de Blogger o WordPress, por ejemplo), sólo tiene que abrir la pestaña "Código" o "HTML" durante la edición de un poste.

2 Insertar "<hr />" (sin comillas) en el lugar que le gustaría un bar o un separador.

3 Guarde la página y compruebe que la barra apareció.

4 Hacer que el "<hr />" buscar fácilmente cualquier forma que desee mediante el acceso a código de hojas de estilo de su sitio que aparece entre "<style>" etiquetas en la sección "<head>" de sus páginas, o alternativamente, un archivo que termina con la extensión CSS.

5 Inserte el siguiente fragmento de código en el extremo de una hoja de estilo:
{hr
anchura: 60%;
altura: 10px;
background-color: gris;
frontera: 1px verde punteada;
}
Obviamente, estos valores pueden ser cualquier cosa que desee (y el ejemplo anterior hace que para un separador bastante feo). Basta con mantener la sintaxis de la misma y cambiar los colores y tamaños para su gusto. Los tamaños pueden ser en píxeles (px) o por porcentaje.
En la opción de "frontera", además de estilos "puntos" son "sólidos", "discontinua", "canto", "groove", "inicio" y "inserción".

6 Hacer que el separador de una imagen de cualquier cosa que desee mediante la inserción de lo siguiente en el final de la hoja de estilo en lugar del código de seguridad:
{hr
Anchura: 400px;
altura: 5px;
Imagen de fondo: url ( 'imageaddress.jpg');
}
Basta con sustituir "imageaddress.jpg" con la dirección web de la imagen. También hay que ajustar las dimensiones de acuerdo a qué tan grande es la imagen. Si se trata de 200 píxeles de ancho por 20 píxeles de alto, establecer el ancho para "200px" y la altura de "20px".