Comment puis-je créer des sauts de ligne en CSS sans utiliser de balises ?

Réaliser des sauts de ligne en CSS sans balises HTML

Dans la conception Web, les sauts de ligne sont essentiels pour présenter le texte de manière organisée et lisible. Traditionnellement, le
La balise a été utilisée pour créer des sauts de ligne. Cependant, il existe des cas où il est souhaitable d'obtenir le même résultat sans utiliser
.

Problème :

Comment pouvons-nous créer un saut de ligne en CSS sans en utilisant le
étiqueter? Prenons l'exemple suivant :

<p>hello <br> How are you</p>

Ce code produit le résultat suivant :

hello
How are you

Solution :

Pour obtenir le même résultat sans en utilisant
, la propriété CSS white-space: pre; peut être appliquée. Cette propriété demande au navigateur de traiter le contenu de l'élément comme du texte préformaté, en préservant les nouvelles lignes.

Dans l'exemple suivant, nous appliquons la propriété white-space: pre; à une propriété

element :

p {
  white-space: pre;
}

<p>hello 
How are you</p>

Ce code produira le même comportement de saut de ligne que le
tag:

hello
How are you

En utilisant white-space: pre;, nous pouvons créer des sauts de ligne en CSS sans avoir besoin de balisage supplémentaire, en simplifiant le code et en conservant une approche plus sémantique.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!