A tag HR é usada em documentos da Web para exibir uma linha horizontal na página ou, às vezes, chamada de régua horizontal. Ao contrário de algumas tags, essa não precisa de uma tag de fechamento, então tudo que você precisa fazer é digitar para inserir a linha.
A linha se estende por toda a largura da página e carrega consigo alguns atributos padrão para descrever a espessura, localização e cor da linha, mas você pode alterar essas configurações se desejar.
Você pode editar as características da linha horizontal em um documento HTML5 editando o CSS da página. Linhas horizontais HTML4 foram alteradas no lado HTML do documento.
A tag de RH é semântica?
Em HTML4, a tag HR não era semântica. Elementos semânticos descrevem seu significado em termos que o navegador e o desenvolvedor podem entender facilmente. A etiqueta de RH era apenas uma maneira de adicionar uma linha simples a um documento onde você quisesse. Estilizando apenas a borda superior ou inferior do elemento onde você queria que a linha aparecesse, colocava uma linha horizontal na parte superior ou inferior do elemento, mas, em geral, a tag HR era mais fácil de usar para essa finalidade.
Começando com HTML5, a tag HR tornou-se semântica e agora define uma quebra temática em nível de parágrafo, que é uma quebra no fluxo do conteúdo que não garante uma nova página ou outro delimitador mais forte - é uma mudança de tópico. Por exemplo, você pode encontrar uma tag de RH após uma mudança de cena em uma história ou pode indicar uma alteração de tópico em um documento de referência.
Atributos de RH em HTML4 e HTML5
Em HTML4, a tag HR pode ser atribuída a atributos simples, incluindo alinhar, largura, e nenhuma sombra . O alinhamento pode ser ajustado para esquerda , Centro , certo ou justificar . A largura ajusta a largura da linha horizontal dos 100 por cento padrão que estende a linha pela página. o nenhuma sombra atributo processa uma linha de cor sólida em vez de uma cor sombreada.
Esses atributos estão obsoletos em HTML5. Você deve usar CSS para estilizar suas tags de RH em documentos HTML5.
Este é um exemplo de HTML5 de estilizar a linha horizontal com 10 pixels de altura usando CSS inline (estilos inseridos diretamente no documento junto com HTML):
Outra maneira de estilizar linhas horizontais em HTML5 é usar um arquivo CSS separado e vinculá-lo a partir do documento HTML. No arquivo CSS, você escreveria o estilo assim: hr {altura: 10px}
O mesmo efeito no HTML4 exige que você adicione um atributo ao conteúdo HTML. Veja como alterar o tamanho da linha horizontal com o Tamanho atributo:
Há muito mais liberdade no estilo de linhas horizontais em CSS versus HTML. Apenas o largura e altura estilos são consistentes em todos os navegadores, portanto, algumas tentativas e erros podem ser necessários ao usar outros estilos. A largura padrão é sempre 100% da largura da página da Web ou do elemento pai. A altura padrão da regra é dois pixels.
