Elemento hr

Si no sabes lo que es un elemento o cómo debes usarlo, te recomiendo leer el tutorial "Tags y atributos en HTML" que puedes encontrar en la sección de tutoriales HTML.

Descripción

El elemento hr reporesenta una división temática o un quiebre en el texto. Este quiebre puede dividir al contenido en dos fragmentos con tópicos diferentes o dos escenas en una novela. Los navegadores habitualmente representan este quiebre visualmente, mediante una línea horizontal.

El elemento hr no debería utilizarse para indicar el inicio o final de una sección. Para estos propósitos existe el elemento section.

En versiones previas del estándar, el elemento hr poseía varios atributos visuales que han sido removidos de la especificación de HTML5. Los autores deberían abandonar su uso en favor de las hojas de estilo.

Ejemplos

En este ejemplo, un par de párrafos son separados por el elemento hr para enfatizar el contraste entre sus temáticas.

<section>
  <h1>Medio de comunicación</h1>
  <p>La radio (entendida como radiofonía o radiodifusión, términos no estrictamente sinónimos) es un medio de comunicación que se basa en el envío de señales de audio a través de ondas de radio, si bien el término se usa también para otras formas de envío de audio a distancia como la radio por Internet.</p>
  <hr>
  <p>La televisión es un sistema para la transmisión y recepción de imágenes en movimiento y sonido a distancia que emplea un mecanismo de difusión. La transmisión puede ser efectuada por medio de ondas de radio, por redes de televisión por cable, televisión por satélite o IPTV, de los que existen en modalidades abierta y paga.</p>
</section>

Medio de comunicación

La radio (entendida como radiofonía o radiodifusión, términos no estrictamente sinónimos) es un medio de comunicación que se basa en el envío de señales de audio a través de ondas de radio, si bien el término se usa también para otras formas de envío de audio a distancia como la radio por Internet.


La televisión es un sistema para la transmisión y recepción de imágenes en movimiento y sonido a distancia que emplea un mecanismo de difusión. La transmisión puede ser efectuada por medio de ondas de radio, por redes de televisión por cable, televisión por satélite o IPTV, de los que existen en modalidades abierta y paga.

Ahora, pongamos un quiebre entre dos párrafos pertenecientes a diferentes escenas de una novela.

<p>La pared estaba congelada y quemaba su oreja pero tenía que saberlo. Luego de unos cuantos minutos soportando el frío y un par de párpados pesados, Jhon se recostó en la cama y cayó inmediatamente en un pesado sueño.</p>
<hr>
<p>El vicecanciller abandonó su oficina apresuradamente. Estaba tenso y perturbado pero hizo un gran esfuerzo para intentar esconder su desesperación...</p>

La pared estaba congelada y quemaba su oreja pero tenía que saberlo. Luego de unos cuantos minutos soportando el frío y un par de párpados pesados, Jhon se recostó en la cama y cayó inmediatamente en un pesado sueño.


El vicecanciller abandonó su oficina apresuradamente. Estaba tenso y perturbado pero hizo un gran esfuerzo para intentar esconder su desesperación...

Atributos

Atributos específicos

align

La alineación horizontal de la línea de quiebre. Existen tres valores posibles (insensibles a mayúsculas/minúsculas):

  • left: la línea de quiebre se alinea a la margen izquierda.
  • center: la línea de quiebre es centrada.
  • right: la línea de quiebre se alinea a la margen derecha.

Debido a su naturaleza visual, este atributo se ha vuelto obsoleto en HTML5 y debería, por lo tanto, dejar de ser utilizado. Los autores pueden reemplazarlo con declaraciones de hojas de estilo.

Ejemplo

<hr align="left">

noshade

Un valor booleano que indica si la línea debe ser plana o tener un estilo 3D. Si el atributo está presente, la línea será plana.

La naturaleza visual de este atributo lo ha vuelto obsoleto en HTML5. Los autores deberían abandonar su uso en favor de las hojas de estilo.

Ejemplo

<hr noshade>

size

Un número de píxeles para utilizar como la altura de la línea horizontal.

Este atributo ha sido removido del estándar HTML5 debido a su naturaleza visual. Los autores deberían abandonar su uso en favor de las hojas de estilo.

Ejemplo

<hr size="3">

width

Un valor que indica el ancho de la línea, en píxeles o como un porcentaje relativo al espacio disponible horizontalmente.

Este atributo se ha vuelto obsoleto en HTML5 debido a su naturaleza visual. Los autores deberían abandonar su uso en favor de las hojas de estilo.

Ejemplo

<hr width="80%">

Atributos globales

Para más información acerca de los atributos globales refiérete a esta lista de atributos gloables en HTML5.

Eventos

Eventos globales

Para más información acerca de los eventos globales refiérete a esta lista de eventos globales en HTML5.