---
title: <hr>
slug: Web/HTML/Element/hr
translation_of: Web/HTML/Element/hr
---
<h2 id="Sumário">Sumário</h2>

<p>O <strong>elemento HTML <code>&lt;hr&gt;</code></strong> representa uma quebra temática entre elementos de nível de parágrafo (por exemplo , uma mudança da cena de uma história, ou uma mudança de tema com uma seção). Nas versões anteriores do HTML, representava uma linha horizontal. Pode continuar sendo exibida como uma linha horizontal nos navegadores, mas agora está definida em termos semânticos, em vez de termos de apresentação.</p>

<ul class="htmlelt">
 <li><dfn><a href="/en-US/docs/HTML/Content_categories" title="HTML/Content_categories">Categorias de conteúdo</a></dfn> <a href="/en-US/docs/HTML/Content_categories#Flow_content" title="HTML/Content categories#Flow content">Fluxo de conteúdo</a>.</li>
 <li><dfn>Conteúdo permitido</dfn> Nenhum, é um {{Glossary("empty element")}}.</li>
 <li><dfn>Omissão de Tag</dfn> Deve conter a tag de início, mas não precisa ter uma tag de encerramento.</li>
 <li><dfn>Elementos pai permitidos</dfn> Qualquer elemento que aceite <a href="/en-US/docs/HTML/Content_categories#Flow_content" title="HTML/Content categories#Flow content">fluxo de conteúdo</a>.</li>
 <li><dfn>Interface DOM</dfn> {{domxref("HTMLHRElement")}}</li>
</ul>

<h2 id="Atributos">Atributos</h2>

<p><span style="line-height: 21px;">Este elemento inclui os </span><a href="https://developer.mozilla.org/en-US/docs/HTML/Global_attributes" style="line-height: 21px;" title="HTML/Global attributes">atributos globais</a><span style="line-height: 21px;">.</span></p>

<dl>
 <dt>{{htmlattrdef("align")}} {{deprecatedGeneric("inline","HTML4.01")}} {{obsoleteGeneric("inline","HTML5")}}</dt>
 <dd>Define a regra de alinhamento na página. Se nenhum valor for especificado, o valor padrão é <code>left</code>.</dd>
 <dt>{{htmlattrdef("color")}} {{Non-standard_inline}}</dt>
 <dd>Denife a regra da cor através do nome da cor ou um valor hexadecimal.</dd>
 <dt>{{htmlattrdef("noshade")}} {{deprecatedGeneric("inline","HTML4.01")}} {{obsoleteGeneric("inline","HTML5")}}</dt>
 <dd>Deine a regra para não ter sombreamento.</dd>
 <dt>{{htmlattrdef("size")}} {{deprecatedGeneric("inline","HTML4.01")}} {{obsoleteGeneric("inline","HTML5")}}</dt>
 <dd>Denife a altura, em pixels.</dd>
 <dt>{{htmlattrdef("width")}} {{deprecatedGeneric("inline","HTML4.01")}} {{obsoleteGeneric("inline","HTML5")}}</dt>
 <dd>Define a regra de comprimento na página através de um valor em pixel ou porcentagem.</dd>
</dl>

<h2 id="Exemplo">Exemplo</h2>

<pre class="brush: html">&lt;p&gt;Este é o primeiro parágrafo do texto. Este é o primeiro parágrafo do texto.
  Este é o primeiro parágrafo do texto. Este é o primeiro parágrafo do texto.&lt;/p&gt;

&lt;hr&gt;

&lt;p&gt;Este é o segundo parágrafo do texto. Este é o segundo parágrafo do texto.
  Este é o segundo parágrafo do texto. Este é o segundo parágrafo do texto.&lt;/p&gt;
</pre>

<p>O HTML acima irá produzir:</p>

<p>Este é o primeiro parágrafo do texto. Este é o primeiro parágrafo do texto. Este é o primeiro parágrafo do texto. Este é o primeiro parágrafo do texto.</p>

<hr>
<p>Este é o segundo parágrafo do texto. Este é o segundo parágrafo do texto. Este é o segundo parágrafo do texto. Este é o segundo parágrafo do texto.</p>

<h2 id="Notas">Notas</h2>

<p>Para alterar a aparencia da linha ou as lacunas entre ela e os parágrafos, utilize <a href="/en-US/docs/CSS" title="CSS">folhas de estilo em cascata</a>.</p>

<h2 id="Specifications" name="Specifications">Especificações</h2>

<table class="standard-table">
 <thead>
  <tr>
   <th scope="col">Especificação</th>
   <th scope="col">Status</th>
   <th scope="col">Comentário</th>
  </tr>
 </thead>
 <tbody>
  <tr>
   <td>{{SpecName('HTML WHATWG', 'grouping-content.html#the-hr-element', '&lt;hr&gt;')}}</td>
   <td>{{Spec2('HTML WHATWG')}}</td>
   <td>Definição do elemento <code>hr</code></td>
  </tr>
  <tr>
   <td>{{SpecName('HTML WHATWG', 'rendering.html#the-hr-element-0')}}</td>
   <td>{{Spec2('HTML WHATWG')}}</td>
   <td>Sugestão de renderização padrão do elemento <code>hr</code></td>
  </tr>
  <tr>
   <td>{{SpecName('HTML5 W3C', 'grouping-content.html#the-hr-element', '&lt;hr&gt;')}}</td>
   <td>{{Spec2('HTML5 W3C')}}</td>
   <td> </td>
  </tr>
  <tr>
   <td>{{SpecName('HTML4.01', 'present/graphics.html#h-15.3', '&lt;hr&gt;')}}</td>
   <td>{{Spec2('HTML4.01')}}</td>
   <td> </td>
  </tr>
 </tbody>
</table>

<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidade nos Navegadores</h2>

<p>{{CompatibilityTable}}</p>

<div id="compat-desktop">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Caracteristica</th>
   <th>Chrome</th>
   <th>Firefox (Gecko)</th>
   <th>Internet Explorer</th>
   <th>Opera</th>
   <th>Safari (WebKit)</th>
  </tr>
  <tr>
   <td>Suporte básico</td>
   <td>1.0</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
  </tr>
 </tbody>
</table>
</div>

<div id="compat-mobile">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Caracteristica</th>
   <th>Android</th>
   <th>Firefox Mobile (Gecko)</th>
   <th>IE Phone</th>
   <th>Opera Mobile</th>
   <th>Safari Mobile</th>
  </tr>
  <tr>
   <td>Suporte básico</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
  </tr>
 </tbody>
</table>
</div>

<h2 id="sect1"> </h2>

<h2 id="Veja_também">Veja também</h2>

<ul>
 <li><a href="/en-US/docs/HTML/Element/p" title="HTML/Element/p">Elemento HTML parágrafo</a></li>
</ul>

<div>{{HTMLRef}}</div>