HTML <hr> Tag


Exemplo

Use a tag <hr> para definir mudanças temáticas no conteúdo:

<h1>The Main Languages of the Web</h1>

<p>HTML is the standard markup language for creating Web pages. HTML describes the structure of a Web page, and consists of a series of elements. HTML elements tell the browser how to display the content.</p>

<hr>

<p>CSS is a language that describes how HTML elements are to be displayed on screen, paper, or in other media. CSS saves a lot of work, because it can control the layout of multiple web pages all at once.</p>

<hr>

<p>JavaScript is the programming language of HTML and the Web. JavaScript can change HTML content and attribute values. JavaScript can change CSS. JavaScript can hide and show HTML elements, and more.</p>

Mais exemplos de "Experimente você mesmo" abaixo.


Definição e uso

A <hr>tag define uma quebra temática em uma página HTML (por exemplo, uma mudança de tópico).

O <hr>elemento geralmente é exibido como uma regra horizontal que é usada para separar o conteúdo (ou definir uma alteração) em uma página HTML.


Suporte ao navegador

Element
<hr> Yes Yes Yes Yes Yes

Atributos Globais

A <hr>tag também suporta os Atributos Globais em HTML .


Atributos do evento

A <hr>tag também suporta os atributos de evento em HTML .



Mais exemplos

Exemplo

Alinhe um elemento <hr> (com CSS):

<hr style="width:50%;text-align:left;margin-left:0">

Exemplo

Um <hr> sem sombra (com CSS):

<hr style="height:2px;border-width:0;color:gray;background-color:gray">

Exemplo

Defina a altura de um elemento <hr> (com CSS):

<hr style="height:30px">

Exemplo

Defina a largura de um elemento <hr> (com CSS):

<hr style="width:50%">

Páginas relacionadas

Referência HTML DOM: objeto HR


Configurações padrão de CSS

A maioria dos navegadores exibirá o <hr>elemento com os seguintes valores padrão:

Exemplo

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