Outros elementos

  1. O elemento br
  2. O elemento hr
  3. O elemento address
  4. O elemento details

O elemento br

Simplesmente introduz uma quebra de linha. É um elemento vazio. O nome da sua tag é uma abreviação para break, que quer dizer quebra. É usado quando você precisa forçar a quebra de linha por algum motivo. De uma forma geral, é melhor deixar a quebra de linha ser feita naturalmente pelo browser. Caso contrário, você pode ter problemas de responsividade. A quebra de linha pode causar um efeito estético ruim em algumas resoluções.

Um caso de uso comum para o elemento <br> são versos de um poema ou letras de músicas:

<p>
  Little boxes on the hillside<br>
  Little boxes made of ticky tacky<br>
  Little boxes on the hillside<br>
  Little boxes all the same
</p>

O elemento hr

O elemento <hr> é um elemento vazio usado quando se quer fazer uma mudança temática, que é renderizado como uma linha horizontal. Ele é um elemento semântico. Portanto, ele não deve ser usado por motivos estéticos. Se esse for o objetivo, você pode usar bordas de CSS.

O elemento address

Esse elemento serve para marcar os detalhes de contato da pessoa que escreveu o documento no qual esse elemento se encontra (não precisa ser necessariamente o endereço da pessoa). Exemplo:

<address>
  <ul>
    <li>Endereço: Rua XYZ, 9999, República, São Paulo-SP</li>
    <li>Telefone: 11 99999-9999</li>
  </ul>
</address>

O elemento details

Esse elemento funciona como uma espécie de acordeão. Esse nome é usado por causa do comportamento do elemento, de expandir e retrair o seu conteúdo quando a label é clicada. O atributo booleano open pode ser usado caso o elemento deva começar com sua informação visível. O elemento <summary> é usado como filho do <details> para fornecer a label do elemento. Se esse elemento não for colocado, é usada a label padrão, que é Detalhes. Exemplo de uso:

<details open>
  <summary>Sua label</summary>
  <p>Lorem ipsum dolor sit amet</p>
</details>