Text-overflow - CSS-Tricks | Almanah CSS 2025

text-overflowProprietatea în CSS se ocupă cu situații în care textul se tunde atunci când se revarsă cutia elementului. Poate fi decupat (adică tăiat, ascuns), poate afișa o elipsă („…”, Unicode Range Value U + 2026) sau poate afișa un șir definit de autor (nu există suport curent de browser pentru șirurile definite de autor).

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

Rețineți că text-overflowapare numai atunci când overflowproprietatea containerului are valoarea hidden, scrollsau autoși white-space: nowrap;.

Debordarea textului se poate întâmpla numai pe elementele bloc sau în bloc, deoarece elementul trebuie să aibă o lățime pentru a putea fi editat. Debordarea are loc în direcția determinată de proprietatea direcției sau de atributele conexe.

Următoarea demonstrație afișează comportamentul text-overflowproprietății, inclusiv toate valorile posibile. Asistența pentru browser variază!

Verificați acest stilou!

Setarea overflowla scrollsau autova afișa bare de derulare pentru a dezvălui textul suplimentar, în timp ce hiddennu. Textul ascuns poate fi selectat prin selectarea elipselor.

Lucruri vechi

O versiune veche a specificației spune că ați putea folosi o adresă URL pentru o imagine pentru elipsa, dar se pare că a fost abandonată.

Există o sintaxă cu două valori, de exemplu text-overflow: ellipsis ellipsis;, care ar controla revărsarea pe laturile stânga și dreapta ale aceluiași container. Nu sunt sigur cum ar fi posibil să se realizeze acest lucru. Poate că textul este centrat într-un container prea mic? Noua specificație spune că acest lucru, precum și definirea unui șir, este „în pericol”.

Nu sunt sigur de unde a ellipsis-wordvenit. Nu figurează în specificații sau în nicio altă documentație decât pe WebPlatform.org.

text-overflowProprietatea folosit pentru a fi o prescurtare pentru combinația text-overflow-modeși text-overflow-ellipsis, dar nu mai și acele proprietăți separate nu există.