La Línea Horizontal puede ser una herramienta muy útil para separar contenidos, además se adapta al ancho de pantalla.

También podemos cambiar su grosor y su color. Aquí te enseñamos como insertar y personalizar Línea Horizontal en HTML.

Como insertar y personalizar línea horizontal en HTML

Para insertar y personalizar línea horizontal en el editor HTML debes realizar los siguientes pasos:

1. Lo primero que debemos hacer es agregar el texto em la herramienta de texto.

2. Para que el proceso sea mas fácil, agregamos un texto cualquiera entre los párrafos que queremos separar.

3. Posteriormente desplegamos los botones avanzados, dándole clic al icono correspondiente, y luego debemos darle clic al botón de HTML.

4. Ahora podemos ver a través del editor HTML. Aquí lo primero que haremos es borrar el texto que se encuentra entre los dos párrafos.

5. Luego debemos en su lugar el código: <hr>.

6. Luego de esto volvemos al editor normal y podemos visualizar la línea horizontal en el lugar en el que colocamos el código.

7. A continuación procedemos a cambiar a color y grosor del borde. Para ello, volvemos al editor HTML y al código anteriormente colocado (<hr>) le agregaremos lo siguiente: style=»border:color grosor solid;». Suponiendo que queremos colocar el borde de color verde y con un grosor de 5px, el código completo debería ser: <hr style=»border:green 5px solid;»>.

8. Luego nos devolvemos al editor normar para verificar que el cambio haya sido efectuado correctamente.

9. Si nos gusta de la anterior manera lo podemos dejar así. En cambio, si queremos quitarle la línea blanca que queda en la mitad del borde, lo que debemos hacer es escribir el código de manera diferente. Siguiendo con el mismo color y el mismo ancho de borde que manejamos en este ejemplo, el código completo nos debería quedar de esta nueva manera: <hr style=»border-color:green; border-width:5px;»>.

10. Ahora si volvemos al editor normal, podemos ver que el borde ya no tiene la línea blanca que había en medio.

Ambas formas de escribir el código son validas, la diferencia está en que una deja una línea blanca en medio del borde y la otra no, elegir una de ellas depende de tu gusto.