append des élipsis sur la dernière ligne de texte

Je veux append des élipsis sur la dernière ligne, ma marge est la suivante:

Yellow gold Yellow gold Yellow gold

.heading4 { height: 98px; position: relative; width: 200px; overflow: hidden; white-space: nowrap }

Je veux que ma sortie soit comme l’ or jaune or jaune jaune go …

si le texte est débordé. Le problème est que si j’ajoute un text-overflow:ellipsis texte tout entier arrive en une ligne, par exemple: Or jaune Or jaune Or … je veux append des points de suspension en bas de page.

Avec CSS standard, non. Tu ne peux pas.

Mais, il existe des CSS non standard spécifiques au navigateur qui le font. Par exemple, les navigateurs basés sur Webkit supportent cela (notamment Chrome) en utilisant -webkit-line-clamp :

Démo: http://jsfiddle.net/abhitalks/C34Gm/1/

CSS pertinentes :

 p { width: 100px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; } 

Référence: https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Webkit_Extensions

Remarque : Ces “extensions de kit Webkit” sont des propriétés propriétaires dotées du préfixe Webkit. Ne pas utiliser sur les sites Web de production, du moins à partir de maintenant.

Utilisez ce plugin jquery pour créer automatiquement des éclipses à la fin du texte, selon vos besoins, sans réinventer la roue:

 http://dotdotdot.frebsite.nl/