Elemento hr en HTML

Elemento hr en HTML

El elemento hr en HTML representa una ruptura tematica entre elementos de parrafo. Este elemento se representa como una linea horizontal que separa el contenido de una página HTML.

En la actualidad se define en términos semántico, en lugar de presentación.

<h2>Biografía</h2>
<p>Juan nació en 1990 y estudió ingeniería informática.</p>

<hr>

<h2>Logros</h2>
<p>Fundó su primera empresa en 2015 y ha creado varias aplicaciones.</p>

<style>
  .custom-hr {
    border: none;
    height: 2px;
    background: linear-gradient(to right, #f00, #0f0, #00f);
    margin: 40px 0;
  }
</style>

<h2>Introducción</h2>
<p>Este es el texto de introducción.</p>

<hr class="custom-hr">

<h2>Contenido principal</h2>
<p>Este es el cuerpo del contenido.</p>

Atributos que puedes aregar al elemento hr

• color: indica el color de la regla mediante nombre de color o valor hexadecimal
• size: indica la altura en pizeles de la regla
• width: indica el ancho de la regla en pixeles o porcentajes