Limitarea lungimii textului într-un link folosind css - blog-tech

Acesta este un titlu lung, va fi afișată în două sau mai multe linii.
O întrebare rezonabilă ia naștere, cum să tăiați textul, astfel încât să se încadreze pe o singură linie? Am sugerăm să utilizați un cod mic în CSS, dacă doriți, și nu-mi place faptul că acum inscripția este afișată în două rânduri.

Cum de a reduce lungimea șirului afișat pe CSS

Pentru a face chiar și cel mai lung textul este afișat într-o singură linie și scrisorile suplimentare au fost tăiate în același timp, utilizați următoarele stiluri CSS pentru blocul în care va fi afișat numele lung, care trebuie să fie scurtat:

Aici, white-space, cu o valoare nowrap anulează linia de transfer, preaplin cu o valoare ascunsă ascunde inutile, și text-preaplin, cu o valoare de elipsă introduce elipsă la sfârșitul anului. Cel mai recent stil am folosit pentru decorarea și frumusețe, el nu este obligat să rezolve problema noastră.
Rezultatul exemplu stiluri limită de lungime string descrise mai sus:

După cum puteți vedea toate lucrările minunate. text lung se taie, iar acum se potrivește pe o singură linie.
Trebuie remarcat faptul că afișajul stilul de exemplu codul de mai sus în mod corect numai în browser-ul suportă standardele CSS3 și HTML5. Cu toate acestea, la momentul scrierii acestui articol, toate browserele moderne îndeplinesc aceste condiții.

mulțumesc

Următoarele surse au fost folosite în scris acest articol: