Prelivanje besedila - CSS-triki

text-overflowHotel v CSS se ukvarja s situacijami, kjer se besedilo odsekanih, ko prestopi polje na vsak element. Lahko ga odrežete (tj. Odrežete, skrijete), prikažete elipso ('...', vrednost obsega Unicode U + 2026) ali prikažete avtorsko določen niz (trenutno ni podpore brskalnika za nize, ki jih določi avtor).

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

Upoštevajte, da text-overflowse pojavi samo takrat, ko je zabojnika overflowima premoženje v vrednosti hidden, scrollali autoin white-space: nowrap;.

Prelivanje besedila se lahko zgodi samo na elementih ravni bloka ali vrstice bloka, ker mora imeti element širino, da bo preliven. Prelivanje se zgodi v smeri, kot jo določa lastnost smeri ali povezani atributi.

Naslednja predstavitev prikazuje vedenje text-overflowlastnosti, vključno z vsemi možnimi vrednostmi. Podpora za brskalnik je različna!

Oglejte si to pisalo!

Če nastavite overflowna scrollali autobodo prikazani drsni trakovi, ki bodo razkrili dodatno besedilo, medtem ko hiddenne. Skrito besedilo lahko izberete z izbiro elipse.

Old Stuff

Stara različica specifikacije pravi, da bi lahko uporabili URL za sliko za elipso, vendar je videti, kot da je ta opuščen.

Obstaja sintaksa z dvema vrednostma, na primer text-overflow: ellipsis ellipsis;, ki bi nadzirala preliv na levi in desni strani istega vsebnika. Nisem prepričan, kako bi bilo to mogoče doseči. Morda osredinjeno besedilo v premajhnem vsebniku? Nova specifikacija pravi, da je to, pa tudi opredelitev niza, "ogroženo".

Nisem prepričan, od kod ellipsis-wordprihaja. Ni v specifikaciji ali v kateri koli drugi dokumentaciji, razen na spletnem mestu WebPlatform.org.

text-overflowLastnina nekoč okrajšava za kombinacijo text-overflow-modein text-overflow-ellipsis, vendar ne več, in ti ločeni lastnosti ne obstajajo.