HTML hr

Descripción

La etiqueta HTML hr (<hr>) define un corte temático en una página HTML (es decir un cambio de tema).

El elemento <hr> se muestra más frecuentemente como una regla horizontal, la cual se utiliza para separar contenidos diferentes (definición de un cambio) en una página HTML.

La etiqueta <hr> está soportada en todos los buscadores estándar.

Atributos

La etiqueta <hr> soporta los atributos globales en HTML y también los atributos de evento en HTML.

Configuración CSS predeterminada

En la Internet, los buscadores visualizan el elemento <hr> con los siguientes valores predeterminados:

hr {
  display: block;
  margin-top: 0.5em;
  margin-bottom: 0.5em;
  margin-left: auto;
  margin-right: auto;
  border-style: inset;
  border-width: 1px;
}

Lenguaje del código: CSS (css)

Ejemplos de uso

Algunos de los ejemplos que puedes encontrar son los que siguen.

Ejemplo 1

Este ejemplo general describe la utilización en términos generales:

<h1>Los lenguajes principales de la Internet</h1>

<p>HTML es el lenguaje estándar de marcado con etiquetas, 
utilizado para la creación de páginas Web. HTML describe 
la estructura de una página en Internet, y consiste en 
una serie de elementos. Los HTML le indican al buscador 
cómo mostrar el contenido.</p>

<hr>

<p>CSS es un lenguaje que describe cómo se visualizarán 
los elementos HTML sobre la pantalla o en otros medios 
de CSS, y le ahorra trabajo, ya que puede controlar a la 
vez el arreglo de página múltiples.</p>

<hr>

<p>JavaScript es el lenguaje de programación HTML 
y de la Internet, así como cambiar el contenido HTML 
y los valores atribuibles. JavaScript puede modificar 
el CSS, a la par que ocultar y mostrar los elementos 
HTML, además de otras opciones.</p>

Lenguaje del código: HTML, XML (xml)

Ejemplo 2

Alineación de un elemento <hr> (con CSS):

<hr style="ancho: 50%; alineación-texto: izquierda; margen-izquierdo: 0">

Lenguaje del código: HTML, XML (xml)

Ejemplo 3

Ajuste de la altura de un elemento <hr> (con CSS):

<hr style="alto:30px">

Lenguaje del código: HTML, XML (xml)

Ejemplo 4

Ajuste del ancho de un elemento <hr> (con CSS):

<hr style="ancho:50%">

Lenguaje del código: HTML, XML (xml)

Ejemplo 5

Un sombreado <hr> (con CSS):

<hr style="alto:2px; margen-ancho:0; color:gris; fondo-color:gris">

Lenguaje del código: HTML, XML (xml)