Maison > interface Web > tutoriel CSS > le corps du texte

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

Patricia Arquette
Libérer: 2024-10-27 02:26:02
original
174 Les gens l'ont consulté

How to Force Line Breaks After Commas in HTML Without Using Non-Breaking Spaces?

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>
Copier après la connexion

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>
Copier après la connexion

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!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois:Formation PHP en ligne sur le bien-être public,Aidez les apprenants PHP à grandir rapidement!