Die Eigenschaft text-overflow in CSS behandelt Situationen, in denen Text abgeschnitten wird, wenn er über das Feld des Elements läuft. Es kann abgeschnitten (dh abgeschnitten, ausgeblendet), ein Auslassungszeichen (…, Unicode-Bereichswert U + 2026) oder eine vom Autor definierte Zeichenfolge angezeigt werden (keine aktuelle Browserunterstützung für vom Autor definierte Zeichenfolgen).
Beachten Sie, dass text-overflow nur auftritt, wenn die overflow -Eigenschaft des Containers den Wert hat hidden, scroll oder auto und white-space: nowrap;.
Textüberlauf kann nur bei Elementen auf Block- oder Inline-Blockebene auftreten, da das Element eine Breite haben muss, um übergelaufen zu werden. Der Überlauf erfolgt in der Richtung, die durch die Richtungseigenschaft oder verwandte Attribute bestimmt wird.
Die folgende Demo zeigt das Verhalten der Eigenschaft text-overflow einschließlich aller möglichen Werte. Die Browserunterstützung variiert!
Einstellung overflow bis scroll oder auto zeigt Bildlaufleisten an, um den zusätzlichen Text anzuzeigen, während hidden wird nicht. Der ausgeblendete Text kann durch Auswahl der Ellipsen ausgewählt werden.
Altes Zeug
Eine alte Version der Spezifikation besagt, dass Sie eine URL zu einem Bild für die Ellipse verwenden könnten, aber es sieht so aus Wenn dies gelöscht wurde.
Es gibt eine Syntax mit zwei Werten, z text-overflow: ellipsis ellipsis;, das den Überlauf auf der linken und rechten Seite desselben Containers steuern würde. Ich bin mir nicht sicher, wie das möglich wäre. Vielleicht zentrierter Text in einem zu kleinen Container? Die neue Spezifikation besagt, dass dies sowie das Definieren einer Zeichenfolge „gefährdet“ ist.
Ich bin nicht sicher, woher ellipsis-word stammt. Es ist nicht in die Spezifikation oder in einer anderen Dokumentation als auf WebPlatform.org.
Die Eigenschaft text-overflow war früher eine Abkürzung für die Kombination von und text-overflow-ellipsis, aber nicht mehr und diese separaten Eigenschaften existieren nicht.
Verwandte Eigenschaften
-
white-space -
overflow -
word-break -
width