W înseamnă linii de suspendare și pauze
Termenul șir suspendat descrie un singur cuvânt la sfârșitul unui paragraf sau al unui titlu.
Astfel de cuvinte apar atunci când ultimul cuvânt dintr-o linie sare pe unul nou, deoarece nu se încadrează în lățime.
Este mult mai bine să ai cel puțin două cuvinte pe ultima linie. Oamenii de multe ori nu vor să lase un cuvânt pe linie. Agenția cu care am lucrat a abordat această întrebare atât de pedantic încât am avut o dorință obsesivă de a verifica din nou nu atât textul cât și titlurile privind absența liniilor de suspendare.
Mai jos, am oferit câteva sfaturi pentru a elimina liniile agățate și cum să lucrați cu pauze de linie.
Încercați să nu folosiți eticheta br pentru a forța o rupere de linie
Folosind o etichetă HTML, putem forța o rupere de linie și să mutăm textul pe o linie nouă.
Curs practic pe aterizare adaptivă de la zero!
Aflați de la zero pentru a adapta aterizările adaptive la HTML5 și CSS3 în următoarele 6 zile
Pe ecrane largi, acest antet poate părea frumos, dar dacă deschideți pagina pe un mic ecran, ruperea liniei poate fi într-un loc incomod, ceea ce va strica antetul. De exemplu:
Acest lucru s-ar putea întâmpla dacă lățimea liniei a fost suficientă numai pentru "Acesta este un titlu lung care". Cuvântul "ar trebui" apoi să sară pe o nouă linie pe cont propriu, după care va fi pusă o pauză forțată, care ar muta o parte din "a merge la o nouă linie în acest loc" pe o linie nouă. Nu foarte plăcută.
Nu utilizați eticheta br ca indentări
Foarte des văd cum o fac elevii. Tocmai au învățat cum să lucreze cu HTML și doresc să deplaseze unele elemente unele de altele. Adăugați mai multe plăcuțe deasupra capacelor, mai mult spațiu între secțiuni sau paragrafe etc.
Folosind etichetele br, puteți adăuga linii goale care vor înlocui liniuțele, dar indicele ar trebui întotdeauna să fie setat în CSS. Proprietatea marjă vă va oferi mult mai multe opțiuni decât br. HTML este pentru conținut, nu pentru stiluri.
Când pot utiliza etichetele br?
Acest lucru contrazice afirmația mea că nu puteți utiliza pauze de linii pentru stiluri? Poate.
Ascundeți pauzele liniei cu afișarea: niciuna
Eticheta br este invizibilă (se traduce doar șirul). Nu are caracteristici vizuale: nu este vizibilă, nu are dimensiunea și forma, culoarea sau orice altceva.
Dar puteți adăuga o clasă la pauza de linie pentru a controla traducerea pe o linie nouă folosind proprietatea de afișare.
Dacă setați afișarea: none, linia de pauză dispare. Dacă setați afișarea: bloc, va apărea o pauză. Uneori poate fi util asociat cu interogările media pentru a adăuga și elimina pauze de linie pe anumite ecrane.
Codul de mai sus elimină diferența în text pentru ecrane mici si mari ecrane pe apare decalajul, iar textul drepturilor de autor este rearanjat în două rânduri.
utilizare pentru îndepărtarea flexibilă a liniilor suspendate
Hai să ne întoarcem unde am pornit acest articol. Dacă utilizați o etichetă pentru a forța o rupere de linie
este imposibil, atunci ce este posibil?
O modalitate mai flexibilă este de a combina două cuvinte într-un simbol neîntrerupt. Apoi, textul va arăta frumos. Luați marcajul de mai jos:
Între cuvintele "șir" și "aici" am adăugat un decalaj inextricabil, din cauza a două cuvinte care se comportă ca una.
Dacă ecranul este lat, antetul se potrivește pe o singură linie și totul arată bine.
Dacă lățimea ecranului scade, atunci cel mai apropiat punct de pauză devine spațiul dintre cuvântul "nou" și șirul "șir aici". Adică, dacă nu este suficient spațiu, se va introduce o pauză de linie, care va muta ultimele două cuvinte pe a doua linie. Nu există linii agățate, totul arată bine.
Vreți să încercați această tehnică în acțiune? Deschideți panoul de dezvoltatori din browser și examinați anteturile acestei pagini. Puteți reduce lățimea ferestrei pentru a vedea cum se comportă cuvintele în fiecare dintre anteturi.
Ediție: Comanda webformself.
Curs practic pe aterizare adaptivă de la zero!
Aflați de la zero pentru a adapta aterizările adaptive la HTML5 și CSS3 în următoarele 6 zile
Cele mai recente știri despre dezvoltarea IT și web pe canalul nostru de telegrame
Practicați HTML5 și CSS3 de la zero la rezultatul!
Articole similare
Trimiteți-le prietenilor: