Code pour remplacer le texte CSS par des points de suspension lorsqu'il dépasse div ou span

Dans le projet, nous devons souvent afficher le texte lorsqu'il est trop long, et remplacer le contenu en excès par des ellipses. Comment cela est-il réalisé à partir du code CSS ? Ci-dessous, l'éditeur de Script House vous donne une explication détaillée en analysant cet article. Les amis intéressés peuvent apprendre ensemble

Dans le projet, on a souvent besoin d'afficher le texte lorsqu'il est trop long, et de le remplacer. le contenu excédentaire avec des points de suspension :
L'idée est :
Définissez d'abord la largeur, puis masquez la partie excédentaire
S'il y a un excès, affichez des points de suspension à la fin
Ne laissez pas le texte s'enrouler
CSS spécifique Le code est :

.title{ 
width:200px; 
overflow:hidden; 
text-overflow:ellipsis; 
white-space:nowrap; 
word-break:keep-all; 
}

Il n'est pas nécessaire d'écrire du code Html, juste une classe p ou span = "titre".

Ce qui précède représente l'intégralité du contenu de cet article. J'espère qu'il sera utile à l'étude de chacun. Pour plus de contenu connexe, veuillez faire attention au site Web PHP chinois !

Recommandations associées :

Résumé des points de connaissances sur le front-end CSS

Utilisation de 63 lignes de code HTML5 pour implémenter Jeu du Serpent

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!