---
title: <hr>
slug: Web/HTML/Element/hr
tags:
  - HTML
  - HTML:Elemento
  - Todas_las_Categorías
translation_of: Web/HTML/Element/hr
original_slug: Web/HTML/Elemento/hr
---
<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>

<p><span class="comment">descripción de uno o dos párrafos</span>El <strong>elemento HTML &lt;hr&gt; </strong>representa un cambio de tema entre párrafos (por ejemplo, un cambio de escena en una historia, un cambio de tema en una sección). En versiones previas de HTML representaba una línea horizontal. Aún puede ser representada como una línea horizontal en los navegadores visuales, pero ahora es definida en términos semánticos y no tanto en términos representativos, por tanto para dibujar una línea horizontal se debería usar el CSS apropiado.</p>

<dl>
 <dd><strong>Sus etiquetas son</strong>: <code>&lt;hr/&gt;</code> (solo tiene una).</dd>
</dl>

<dl>
 <dd><strong>Crea una caja</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_bloque">en bloque</a>.</dd>
</dl>

<dl>
 <dd><strong>Está definido como</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_bloque">en bloque</a>.</dd>
</dl>

<dl>
 <dd><strong>Puede contener</strong>: Nada, es un "elemento vacío" del un Glosario.</dd>
</dl>

<h4 id="Atributos" name="Atributos">Atributos</h4>

<table class="fullwidth-table standard-table">
 <tbody>
  <tr>
   <th>Atributo</th>
   <th colspan="2">Valor</th>
   <th>Descripción</th>
  </tr>
  <tr>
   <th colspan="4">Genéricos</th>
  </tr>
  <tr>
   <td><code style="color: green;">title </code></td>
   <td>Texto</td>
   <td>Implícito</td>
   <td>Título consultivo del elemento.</td>
  </tr>
  <tr>
   <td><code style="color: green;">style </code></td>
   <td>Declaraciones de estilo</td>
   <td>Implícito</td>
   <td>Información de estilo en línea.</td>
  </tr>
  <tr>
   <td><code style="color: green;">id </code></td>
   <td>Un 'nombre'</td>
   <td>Implícito</td>
   <td>Identificador único a nivel de documento.</td>
  </tr>
  <tr>
   <td><code style="color: green;">class </code></td>
   <td>Lista de clases CSS</td>
   <td>implícito</td>
   <td>Identificador a nivel de documento.</td>
  </tr>
  <tr>
   <td><code style="color: green;">dir </code></td>
   <td>Uno de los siguientes: <code>"ltr"</code> o <code>"rtl"</code></td>
   <td>Implícito</td>
   <td>Dirección del texto.</td>
  </tr>
  <tr>
   <td><code style="color: green;">lang </code></td>
   <td>Código de idioma</td>
   <td>Implícito</td>
   <td>Información sobre el idioma.</td>
  </tr>
  <tr>
   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup. </code></td>
  </tr>
  <tr>
   <th colspan="4">Específicos</th>
  </tr>
  <tr>
   <td colspan="4">No tiene</td>
  </tr>
  <tr>
   <th colspan="4">De transición</th>
  </tr>
  <tr>
   <td><code style="color: green;">align </code></td>
   <td>uno de los siguientes: <code>"left", "center", "right".</code></td>
   <td>Implícito. Por defecto: <code>"center"</code></td>
   <td>Indica la alineación horizontal.</td>
  </tr>
  <tr>
   <td><code style="color: green;">noshade </code></td>
   <td><code>"noshade"</code></td>
   <td>Implícito</td>
   <td>Elimina el relieve.</td>
  </tr>
  <tr>
   <td><code style="color: green;">size </code></td>
   <td>Una cantidad, de píxeles</td>
   <td>Implícito</td>
   <td>Indica la altura de la linea.</td>
  </tr>
  <tr>
   <td><code style="color: green;">width </code></td>
   <td>Una cantidad, de píxeles, o un porcentaje.</td>
   <td>Implícito. por defecto: 100%</td>
   <td>Indica la anchura.</td>
  </tr>
  <tr>
   <th>Atributo</th>
   <th colspan="2">Valor</th>
   <th>Descripción</th>
  </tr>
 </tbody>
</table>

<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>

<pre class="eval">  &lt;p&gt;Este es un parrafo unicamente visual para ver el uso de
 la etiqueta hr&lt;/p&gt;
  &lt;hr/&gt;
  &lt;p&gt;Este es el segundo parrafo, separado del primero por la etiqueta hr, que puede
representarse mediante una línea horizontal.&lt;/p&gt;
</pre>

<h3 id="Muestra">Muestra</h3>

<p>Este es un parrafo unicamente visual para ver el uso de la etiqueta hr</p>

<hr>
<p>Este es el segundo parrafo, separado del primero por una linea horizontal</p>

<h3 id="Comentarios" name="Comentarios">Comentarios</h3>

<p> </p>

<h3 id="Referencia" name="Referencia">Referencia</h3>

<ul>
 <li>El elemento <a class="external" href="http://html.conclase.net/w3c/html401-es/present/graphics.html#edef-HR"><strong>hr</strong> en la especificación</a> de html 4.01</li>
</ul>

<p><span class="comment">secciones futuras: == Soporte de los navegadores == == Valores por defecto y visualización en Firefox ==</span></p>

<div class="note">
<p>Este documento está siendo editado, posiblemente contenga defectos y carencias. ¡Estamos en obras!... disculpen las molestias.</p>

<p>¿Quieres participar en la elaboración de este documento? Para saber como hacerlo consulta <a>MDC:Como ayudar</a>.</p>
</div>

<p> </p>