Introdução
Se você quiser que sua página web mostre a mensagem abaixo com o mesmo formato, como você escreverá isso em HTML?
Se você estiver planejando usar o avanço de carro (tecla ENTER) para produzir quebras de linha, então deixe-me dizer que isso não funcionará porque o HTML ignorará qualquer avanço de carro e espaços extras.
Você pode usar a tag br que é usada para produzir quebras de linha no HTML e aqui estão as duas maneiras possíveis de usar a tag br.
Snippet 1:
<div>
Hello <br>
Welcome to <br>
the blog<br>
</div>
Snippet 2:
<div>
Hello <br/>
Welcome to <br/>
the blog <br/>
</div>
Ambos darão a mesma saída, mas qual é a diferença entre br e br/?
Antes disso, vamos dar uma olhada em algumas dicas.
- A tag br é usada para produzir quebras de linha em um documento HTML e é uma tag auto-fechada.
- Quando uma tag é usada sem nada entre ela, então uma tag auto-fechada (ou tag vazia) pode ser usada. br é uma dessas tags auto-fechadas, o que significa que não há necessidade de uma tag de fechamento ( /br) ao usar br.
- Geralmente, TAG/ (não deve ser confundido com /TAG) é usado como uma forma condensada de escrever TAG…/TAG.
Das informações acima, é evidente que br e br/ terão o mesmo resultado quando usados em HTML.
No entanto, quando usamos XHTML (que é mais rigoroso do que HTML), não é permitido deixar tags abertas (como não se pode escrever apenas br, tem que fechar também, mas /br não faz sentido uma vez que é uma tag de auto-fechamento), portanto br/ será usado nesse caso.
Além disso, usar br é menos eficaz quando se trata de limpeza de código e legibilidade do que br/. Portanto, br/ é geralmente preferido a br.
Para resumir, as principais diferenças entre br e br/ em HTML podem ser entendidas com a ajuda da seguinte tabela:
A diferença entre a tag br e a tag br/
Compatibilidade do Navegador
Vamos olhar sua compatibilidade com navegadores agora.
Navegadores de desktop
Conclusão
Ambos br e br/ produzem o mesmo resultado, ou seja, quebra de linha. Mas br/ é preferido porque pode ser usado com regras estritas também (como ao escrever um documento XHTML) e o último parece mais limpo e legível. Leia mais sobre outras tags auto-fechadas nos tópicos Scaler.