Vlastnost text-overflow v CSS se zabývá situacemi, kdy je text oříznut, když přetéká pole prvku. Lze jej oříznout (tj. Oříznout, skrýt), zobrazit elipsu (…, Unicode Range Value U + 2026) nebo zobrazit autorem definovaný řetězec (žádná aktuální podpora prohlížeče pro řetězce definované autorem).
Upozorňujeme, že text-overflow se vyskytuje pouze tehdy, když má vlastnost overflow kontejneru hodnotu hidden, scroll nebo auto a white-space: nowrap;.
K přetečení textu může dojít pouze u prvků na úrovni bloku nebo vloženého bloku, protože prvek musí mít šířku, aby mohl být přetečen. Přetečení nastává ve směru určeném vlastností direction nebo souvisejícími atributy.
Následující ukázka zobrazuje chování vlastnosti text-overflow včetně všech možných hodnot. Podpora prohlížeče se liší!
Nastavení overflow až scroll nebo auto zobrazí posuvníky, které odhalí další text, zatímco hidden nebude. Skrytý text lze vybrat výběrem elips.
Old Stuff
Stará verze specifikace říká, že pro elipsu můžete použít adresu URL obrázku, ale vypadá to, že pokud to bylo zrušeno.
K dispozici je syntaxe dvou hodnot, např text-overflow: ellipsis ellipsis;, který by řídil přetečení na levé a pravé straně stejného kontejneru. Nejsem si jistý, jak by toho bylo možné dosáhnout. Možná centrovaný text v příliš malém kontejneru? Nová specifikace říká, že toto a definování řetězce je „ohroženo“.
Nejsem si jistý, odkud pochází ellipsis-word. Není to v specifikace nebo v jakékoli jiné dokumentaci jiné než na WebPlatform.org.
Vlastnost text-overflow bývala zkratkou pro kombinaci text-overflow-mode a text-overflow-ellipsis, ale už ne a tyto samostatné vlastnosti neexistují.
Související vlastnosti
-
white-space -
overflow -
word-break -
width