Szöveg-túlcsordulás - CSS-trükkök

A text-overflowCSS tulajdonság olyan helyzetekkel foglalkozik, amikor a szöveget levágják, amikor túlcsordítja az elem mezőjét. Lehet nyírni (azaz levágni, elrejteni), ellipszist megjeleníteni ('…', Unicode tartomány értéke U + 2026), vagy megjeleníteni egy szerző által definiált karakterláncot (a böngésző nem támogatja a szerző által definiált karakterláncokat).

.ellipsis ( text-overflow: ellipsis; /* Required for text-overflow to do anything */ white-space: nowrap; overflow: hidden; )

Jegyezzük meg, hogy text-overflowcsak akkor következik be, ha a tároló overflowtulajdonság értéke hidden, scrollvagy a autoés white-space: nowrap;.

A szöveg túlcsordulása csak blokk vagy inline blokk szintű elemeken történhet, mert az elemnek szélességnek kell lennie ahhoz, hogy túlcsorduljon. A túlcsordulás az iránytulajdonság vagy a kapcsolódó attribútumok által meghatározott irányban történik.

A következő bemutató a text-overflowtulajdonság viselkedését mutatja be, beleértve az összes lehetséges értéket. A böngésző támogatása változó!

Nézze meg ezt a tollat!

Beállítás overflow, hogy scrollvagy automegjeleníti gördítősávokat, hogy felfedje a kiegészítő szöveget, miközben hiddennem. A rejtett szöveg az ellipszisek kiválasztásával választható ki.

Régi dolog

A specifikáció régi verziója szerint az ellipszishez használhat URL-t egy képhez, de úgy tűnik, mintha ezt eldobták volna.

Van kétértékű szintaxis, pl text-overflow: ellipsis ellipsis;., Amely szabályozza a túlfolyást ugyanazon tároló bal és jobb oldalán. Nem tudom, hogyan lehetne ezt elérni. Talán középre helyezett szöveg egy túl kicsi tárolóban? Az új specifikáció szerint ez, valamint egy húr meghatározása „veszélyben van”.

Nem tudom, honnan ellipsis-wordjött. Ez nem szerepel a specifikációban vagy a WebPlatform.org webhelyen kívül más dokumentációban.

Az text-overflowingatlan szokott lenni rövidítés kombinációja text-overflow-modeés text-overflow-ellipsis, de most már nem, és azok külön tulajdonságok nem léteznek.