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

Comment afficher des ellipses dans une travée avec un débordement caché ?

Patricia Arquette
Libérer: 2024-10-30 04:27:02
original
240 Les gens l'ont consulté

How to Display Ellipses in a Span with Hidden Overflow?

Comment concaténer des ellipses dans un contenu avec un débordement masqué

Dans cette question, un développeur exprime le besoin d'afficher des ellipses ("... ") dans un élément span avec débordement caché. Ils fournissent un extrait de code CSS présentant le débordement caché, mais pas l'affichage des points de suspension.

La solution fournie suggère d'utiliser la propriété text-overflow: ellipsis, qui permet la troncature du contenu et la affichage d'ellipses lorsque le contenu de l'élément dépasse sa largeur. Voici le code CSS corrigé :

<code class="css">span {
  display: inline-block;
  width: 180px;
  white-space: nowrap;
  overflow: hidden !important;
  text-overflow: ellipsis;
}</code>
Copier après la connexion

La propriété supplémentaire white-space: nowrap garantit que le contenu ne s'enroule pas sur plusieurs lignes, ce qui peut empêcher les points de suspension d'apparaître correctement.

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