Comment sauter une ligne ou aller à la ligne en HTML ?

Question

Quelles sont les bonnes pratiques pour sauter une ligne en HTML, ou aller à la ligne en HTML ?

Answer 1

Que vous vouliez passer à la ligne, ou bien sauter une ligne, en HTML, la méthode diffère selon les types de contenus entre lesquels vous voulez effectuer l'espacement, ou le retour à la ligne.

Pour sauter une ligne ou aller à la ligne en HTML, procédez comme suit :

• Utilisez la balise <BR> lorsque le contenu est textuel.
• Utilisez la propriété CSS margin lorsque le contenu est du type Bloc HTML.

Exemple de saut de ligne HTML avec la balise <BR> :

<p>
Une première ligne de texte au sein d'un paragraphe.
<br>
Une seconde ligne de texte au sein d'un même paragraphe.
</p>

Exemple de saut de ligne HTML avec la propriété margin CSS :

<div style="margin: 0 0 10px 0;">Un bloc HTML avec du contenu</div>
<div>Un autre bloc HTML avec du contenu</div>

Dans ce dernier exemple, on crée un espacement en bas du premier bloc, de 10 pixels, entre les deux blocs HTML <div>, via la propriété CSS margin.

Answer 2

Deux autres solutions possibles pour aller à la ligne en HTML sont l'utilisation des propriétés CSS white-space: pre; et display: block;.

Exemple avec white-space: pre; :

<div style="white-space: pre"> 
Ligne 1
Ligne 2
</div> 

Exemple avec display: block; :

<style> 
p span { 
display: block; 
} 
</style> 
<p> 
<span>Ligne 1</span> 
<span>Ligne 2</span> 
</p>