Comment forcer les sauts de ligne après les virgules en HTML sans utiliser d'espaces insécables ?

Comment influencer les sauts de ligne en HTML

En HTML, les sauts de ligne sont généralement déterminés par des espaces ou d'autres sauts de ligne désignés. Cependant, il peut arriver que vous souhaitiez donner la priorité aux sauts de ligne à des emplacements spécifiques, en particulier après les virgules. Cet article explore les techniques pour y parvenir sans recourir à des espaces insécables.

Le Element

L'approche originale envisageait d'utiliser éléments pour envelopper des fragments de texte. Cependant, cette technique s'est avérée inefficace.

text-wrap : éviter la propriété CSS

Le comportement CSS3 text-wrap : éviter semble prometteur, mais il peut nécessiter des considérations de compatibilité du navigateur .

Utilisation de la propriété display:inline-block

La propriété display:inline-block peut être appliquée à un pour conserver les fragments de texte ensemble sous forme de bloc en ligne.

<code class="css">span.avoidwrap { display:inline-block; }</code>

En enveloppant le texte souhaité dans cet élément élément, il sera traité comme un seul bloc qui enveloppe son intégralité. Ce n'est qu'après avoir enveloppé le bloc que le texte à l'intérieur sera divisé en fragments plus petits si nécessaire.

<code class="html"><span class="avoidwrap">Honey Nut Cheerios,</span>
<span class="avoidwrap">Wheat Chex,</span>
<span class="avoidwrap">Grape-Nuts,</span></code>

Cette approche vous permet de contrôler plus finement les sauts de ligne tout en conservant l'apparence visuelle souhaitée sans recourir à des espaces insécables. qui modifient la largeur hors tout de manière inconditionnelle.

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!