Linha Horizontal

Há muitas maneiras de se desenhar um separador horizontal em HTML e CSS. O jeito certo vai depender de cada caso. Neste artigo eu vou te explicar as principais formas. Em geral, a tag HTML hr (horizontal rule) é uma tag semântica que serve para criar uma linha horizontal, separando elementos horizontalmente. Porém a tag hr não é ideal para separar elementos em listas li, por exemplo. Neste caso, devemos utilizar CSS.

---

Linha horizontal com <hr>

A tag <hr> (horizontal rule) é um elemento HTML ideal para separação entre parágrafos e blocos de conteúdo. Você pode até usar outro método para separar o conteúdo visualmente, mas estaria perdendo a função semântica da tag <hr>. Na versão HTML5, a tag passou a não ser apenas uma linha visual, mas passou a ser uma tag semântica, ou seja, a função dessa tag agora também serve para que os mecanismos de busca entendam que quando a tag está presente, ela denota uma separação de conteúdo, e por isso é importante que seja usada nos lugares certos.