Cum se schimbă spațierea literelor în css. Cum se schimbă spațierea literelor în Word


De regulă, pentru fiecare font de o anumită dimensiune, valorile sunt prestabilite spații dintre cuvinte, distanța dintre literele dintr-un cuvântȘi înălțimea liniei vizuale. Trebuie remarcat faptul că distanța dintre diferitele litere în fonturi monospațiate, cum ar fi Courier New, este întotdeauna aceeași. În alte tipuri de fonturi, distanța dintre litere depinde de combinațiile de litere - în cele mai multe cazuri este fixă, dar între unele perechi de litere este redusă în mod deliberat pentru a face vizual textul mai „uniform” și uniform distribuit. De exemplu, distanța dintre literele AU este mai mică decât între literele NP, deoarece literele N și P au formă dreaptă, iar literele A și U au teșituri, în plus, îndreptate într-o singură direcție. Dacă distanța dintre litere este aceeași, A și U vor apărea mai departe decât H și P. Pentru a atenua acest efect, distanța dintre ele este ușor redusă, rezultând o linie de text aliniată vizual. Acest fenomen este una dintre cele mai izbitoare manifestări ale iluziei optice.

ÎN CSS pentru blocurile de text, puteți ajusta dimensiunea distanțelor dintre cuvintele din text, adică, în esență, modificați dimensiunea spațiului. De asemenea, puteți modifica distanțele dintre literele dintr-un cuvânt (adică să creați text dens sau rar) și să controlați înălțimea liniei de text. Înălțimea liniei este distanța dintre liniile de bază a două linii adiacente.

Nu există analogi ale unor astfel de proprietăți în HTML. Intervalele pot fi setate numai folosind CSS.

proprietatea de spațiere a cuvintelor

Această proprietate vă permite să setați distanța dintre cuvinte. Orice unitate de lungime este permisă ca valoare, atât pozitivă, cât și negativă. Cu valori negative, distanța dintre cuvinte scade, iar cu valori prea mari, cuvintele se pot apropia prea mult sau chiar „se pot ciocni” unele în altele. Acest lucru va afecta negativ lizibilitatea textului, așa că aveți grijă când setați astfel de valori. Nu este permisă specificarea valorilor procentuale.

Să ne uităm la un exemplu:

proprietatea de spațiere între litere

Această proprietate specifică distanța dintre literele dintr-un cuvânt. Este setat în mod similar cu distanța dintre cuvinte în orice unități de lungime. Este posibil să setați valori negative, în care literele pot fi prea apropiate unele de altele sau chiar să se suprapună. Prin urmare, folosiți-l cu atenție. Setarea valorii ca procent nu este permisă.

Folosind această proprietate, puteți subțire literele, de exemplu în titluri, care vor arăta destul de originale. Se recomandă ca, pe de o parte, distanța dintre litere să fie mărită atât de semnificativ încât titlul să iasă în evidență vizual pe fundalul textului obișnuit, iar pe de altă parte, distanța să nu fie prea mare, astfel încât percepția generală. a textului nu se deteriorează.

Ambele proprietăți spațierea cuvintelorȘi spațiul dintre litere pot fi folosite împreună, deoarece pe măsură ce creșteți spațierea dintre litere, pentru a menține lizibilitatea și cuvintele separate, este posibil să fie necesar să măriți distanța dintre cuvinte în același timp. Iată un exemplu tipic de design de antet:

H1 (spațiere între cuvinte: 2 ex; spațiere între litere: 0,3 ex)

Aliniați după distanța specificată

Luați în considerare alinierea verticală la o distanță dată. Proprietatea de aliniere verticală este foarte simplă: mută un element în sus sau în jos pe o distanță specificată. Astfel, expresia vertical align: 5px; va muta elementul în sus cu cinci pixeli față de poziția inițială. Valorile negative ale lungimii mută elementul în jos. Această formă simplă de aliniere nu a fost prezentă în CSS1, dar a fost adăugată în CSS2.

Este important să înțelegeți că textul aliniat vertical nu devine parte dintr-o altă linie și nici nu se suprapune pe alte linii. Aruncă o privire la fig. 6.18, unde o parte a textului aliniat vertical se află în mijlocul paragrafului.

După cum puteți vedea, orice element aliniat vertical poate afecta înălțimea liniei. Amintiți-vă descrierea unui container de linie a cărui înălțime este suficientă pentru a găzdui partea de sus a celui mai înalt bloc de linie și partea de jos a celui mai scurt bloc de linie. Acest lucru se aplică și blocurilor în linie care au fost mutate în sus sau în jos în timpul alinierii verticale.

Orez. 6.18. Alinierea verticală poate duce la creșterea înălțimii rândurilor

Spațierea dintre litere și cuvinte

Acum că am terminat cu alinierea, să trecem la gestionarea distanței dintre cuvinte și litere. Aceste proprietăți au și propriile lor specificități.

Spațierea dintre cuvinte

Proprietatea de spațiere a cuvintelor permite valori de lungime pozitive sau negative. Această valoare este adăugată la spațierea standard între cuvinte. În esență, spațierea cuvintelor este folosită pentru a modifica distanța dintre cuvinte. Prin urmare, valoarea implicită normală este aceeași cu valoarea zero (0).

Dacă specificați o valoare pozitivă a lungimii, distanța dintre cuvinte va crește. Și dacă setați o valoare negativă pentru spațierea cuvintelor, cuvintele se vor apropia unul de celălalt:

174 Capitolul 6. Proprietăţi text

p.spread (spațierea cuvintelor: 0.5em;) p.sight (spațierea cuvintelor: 0.5em;) p.base (spațierea cuvintelor: normal;) p.norm (spațierea cuvintelor: 0;)

Spațiile dintre cuvintele din acest paragraf vor fi mărite cu 0,5 em.

Spațiile dintre cuvintele din acest paragraf vor fi reduse cu 0,5 em.

Spațiile dintre cuvintele din acest paragraf vor fi normale.

Efectul acestor setări este prezentat în Fig. 6.19.

Orez. 6.19. Schimbarea distanței dintre cuvinte

Până acum nu am dat o definiție precisă a termenului „cuvânt”. În terminologia CSS, un „cuvânt” este orice linie care nu conține caractere delimitare și este delimitată de caractere delimitare pe ambele părți. Această definiție nu este semantică; pur și simplu presupune că documentul conține cuvinte înconjurate de unul sau mai multe caractere delimitare. Nu se poate aștepta ca un agent utilizator activat pentru CSS să poată distinge un cuvânt de un non-cuvânt în toate cazurile într-o anumită limbă. Această definiție, oricare ar fi ea, înseamnă că este puțin probabil ca spațierea cuvintelor să funcționeze în limbi bazate pe pictografie sau stiluri de scriere non-romane. Această proprietate vă permite să creați documente complet ilizibile, așa cum se poate observa clar în Fig. 6.20. Spațierea cuvintelor trebuie folosită cu prudență.

Orez. 6.20. Distanțe foarte mari între cuvinte

Spațiul dintre litere

Multe dintre problemele întâlnite atunci când lucrați cu spațierea cuvintelor apar atunci când utilizați spațierea literelor. Singura diferență dintre cele două este că proprietatea spațiere dintre litere modifică spațierea dintre caractere sau litere.

Ca și în cazul proprietății de spațiere a cuvintelor, o valoare validă pentru spațierea dintre litere este orice lungime. Valoarea implicită este cuvântul cheie normal (care este același cu spațierea dintre litere: 0). Orice valoare a lungimii pe care o introduceți va crește sau micșora distanța dintre litere cu acea sumă. În fig. Figura 6.21 arată rezultatele aplicării următorului marcaj:

p (spațiere între litere: 0;) /* identic cu „normal” */

p.spacious (spațiere dintre litere: 0,25 em;) p.strâns (spațiere dintre litere: 0,25 em;)

Literele din acest paragraf sunt spațiate ca de obicei.

Literele din acest paragraf sunt puțin întinse.

Literele din acest paragraf sunt puțin zdrobite.

Orez. 6.21. Spațiere diferită între litere

Orez. 6.22. Utilizarea proprietății letter%spacing pentru a face textul selectat mai expresiv

Utilizarea spațierii dintre litere pentru a spori accentul este o tehnică cinstita de timp. S-ar putea scrie următorul anunț și obține efectul prezentat în Fig. 6.22:

puternic (spațiere între litere: 0,2 em;)

Acest paragraf contine text puternic accentuat care este răspândit pentru un accent suplimentar.

Spațierea și alinierea cuvintelor și literelor

Valoarea spațierii cuvintelor poate fi influențată de valoarea proprietății text align. Dacă elementul este justificat, spațiile dintre litere și cuvinte sunt ajustate astfel încât textul să se întinde pe întreaga linie. Acest lucru poate modifica, la rândul său, parametrii care determină distanța dintre cuvinte și litere, declarați de autor în proprietățile de spațiere a cuvintelor. Dacă spațierea dintre litere este setată, aceasta nu poate fi schimbată prin alinierea textului, dar dacă spațierea dintre litere este setată la normal, distanța dintre caractere poate fi modificată pentru a se asigura că textul este justificat. CSS nu specifică cum ar trebui calculate spațiile albe, așa că agentul utilizator pur și simplu le creează.

Elementul copil moștenește valoarea calculată a părintelui său, ca de obicei. Nu puteți face astfel încât în ​​loc de valoarea calculată a proprietăților de spațiere dintre cuvinte sau spațiere dintre litere, factorul de scalare să fie moștenit (cum este cazul înălțimii liniei). Ca urmare, este posibil să întâmpinați problema prezentată în Fig. 6.23:

p (spațiere între litere: 0,25 em; dimensiunea fontului: 20px;) mic (dimensiunea fontului: 50%;)

Acest paragraf spațios text minuscul care este la fel de spațios, chiar dacă autorul a dorit probabil ca spațierea să fie proporțională cu dimensiunea textului.

Orez. 6.23. Spațiu moștenit între litere

Modificarea spațierii standard între litere din text poate fi necesară pentru a atrage atenția asupra secțiunilor sale individuale. Pentru a schimba spațierea dintre litere în Word, trebuie să urmați secvența dată de acțiuni.

Ajustarea intervalului


Pentru a mări spațiul dintre litere, selectați Rar.

În mod implicit, puteți extinde distanța dintre litere cu 1 punct, egal cu 0,35 mm. Pentru comoditatea utilizatorului, în partea de jos este furnizată o mostră care arată cum va arăta textul în acest caz. În mod evident, utilizatorul poate modifica valoarea cu 1 punct folosind triunghiurile mici pentru a adăuga sau scădea spațierea cu 0,1 pt. O altă opțiune este să introduceți direct valoarea dorită în câmpul dimensiune interval și să faceți clic pe OK. Puteți introduce o distanță arbitrar de mare.

Pentru a reduce intervalul, trebuie să selectați „Comprimat”.

Utilizatorul poate reduce spațierea dintre litere în același mod ca în cazul precedent - implicit cu 1 pt, sau setând valoarea dorită. După cum se poate observa din eșantion, în acest caz, compactarea textului a avut un impact negativ asupra lizibilității acestuia.

Modificarea spațierii dintre litere discutată mai sus este aceeași pentru toate literele textului selectat. În editorul de text Word, este posibil să schimbați spațierea literelor mai subtil, ținând cont de caracteristicile stilului literelor adiacente. Când funcția de kerning este activată, Word selectează automat distanța optimă între perechile de caractere, în funcție de caracteristicile fontului. Scopul kerningului este de a crește atractivitatea vizuală a textului.

O comparație atentă a ultimelor două capturi de ecran – înainte și după kerning – vă permite să verificați acest lucru. Kerningul este folosit în principal în textele cu fonturi mari - titluri și logo-uri.

Video: Cum să măresc distanța dintre litere?

Mai sus, luarea în considerare a spațierii dintre litere a fost efectuată în raport cu Word 2010. În cele mai apropiate versiuni de Word - 2007 și 2013 nu există diferențe.

Definește distanța dintre caractere dintr-un element. Browserele stabilesc de obicei distanța dintre caractere în funcție de tipul fontului, dimensiunea fontului și setările sistemului de operare. Pentru a modifica această valoare se folosește această proprietate. Este acceptabil să folosiți o valoare negativă, dar în acest caz trebuie să vă asigurați că lizibilitatea textului este menținută.

informatie scurta

Denumiri

DescriereExemplu
<тип> Indică tipul valorii.<размер>
A && BValorile trebuie să fie afișate în ordinea specificată.<размер> && <цвет>
A | BIndică faptul că trebuie să selectați o singură valoare dintre cele propuse (A sau B).normal | litere mici
A || BFiecare valoare poate fi folosită independent sau împreună cu altele în orice ordine.lățime || numara
Grupează valori.[ recolta || cruce ]
* Repetați de zero sau de mai multe ori.[,<время>]*
+ Repetați una sau mai multe ori.<число>+
? Tipul, cuvântul sau grupul specificat este opțional.medalion?
(A, B)Repetați cel puțin A, dar nu mai mult de B ori.<радиус>{1,4}
# Repetați o dată sau de mai multe ori, separate prin virgule.<время>#
×

Valori

Orice unități de lungime acceptate în CSS sunt acceptate ca valori - de exemplu, pixeli (px), inci (in), puncte (pt), etc. Cele mai bune rezultate sunt obținute prin utilizarea unităților relative bazate pe dimensiunea fontului (em și ex ).

Normal Setează distanța dintre caractere ca normal.

Cutie cu nisip

Winnie the Pooh nu s-a împotrivit întotdeauna un pic de răcoare, mai ales la unsprezece dimineața, pentru că la acea oră micul dejun se terminase de mult, iar prânzul încă nu începuse. Și, bineînțeles, era teribil de bucuros să vadă că Iepurele scotea cești și farfurii.

div (spațiere între litere: 0; )

Exemplu

spațiul dintre litere

Punctul culminant, după o analiză atentă, taie în mod semnificativ cercul mare ecuatorial al sferei cerești, așa cum sa întâmplat în 1994 cu cometa. Cizmar-Levy 9.

Rezultatul acestui exemplu este prezentat în Fig. 1.

Orez. 1. Aplicarea proprietății de spațiere între litere

Model obiect

Un obiect.style.letterSpacing

Specificație

Fiecare specificație trece prin mai multe etape de aprobare.

  • Recomandare - Specificația a fost aprobată de W3C și este recomandată ca standard.
  • Recomandarea candidatului ( Recomandare posibilă) - grupul responsabil de standard este mulțumit că își îndeplinește obiectivele, dar necesită ajutor din partea comunității de dezvoltare pentru implementarea standardului.
  • Recomandare propusă Recomandare sugerată) - în această etapă documentul este înaintat Consiliului Consultativ W3C pentru aprobare finală.
  • Proiect de lucru - O versiune mai matură a unui proiect care a fost discutat și modificat pentru revizuire comunitară.
  • Schița redactorului ( Proiect editorial) - o versiune preliminară a standardului după ce au fost făcute modificări de către editorii de proiect.
  • Ciornă ( Proiect de specificație) - prima versiune a standardului.
×
  • Cartea secolelor al XVI-lea și al XVII-lea.
  • Cartea secolului al XVIII-lea.
  • Cărți în Rusia în secolele XVI-XVIII.
  • Cartea secolelor al XIX-lea și al XX-lea.
    • Cartea secolelor al XIX-lea și al XX-lea. - pagina 2
    • Cartea secolelor al XIX-lea și al XX-lea. - pagina 3
  • carte sovietică
  • COMPOZIŢIE
    • Compoziţie
    • Scheme de bază ale compoziției liniare și impactul lor vizual
      • Scheme de bază ale compoziției liniare și impactul lor vizual - pagina 2
    • Compoziție tonală
    • Factori fiziologici în compoziția grafică
    • ratia de aur
      • Raportul de aur - pagina 2
    • Formatul bandă și instalarea acestuia pe pagină
      • Formatul bandă și instalarea acestuia pe pagină - pagina 2
      • Formatul bandă și instalarea acestuia pe pagină - pagina 3
    • Compoziția în interiorul benzii
      • Design de text grafic
      • Accentuarea textului
      • Dungile de început și de sfârșit
    • Elemente de titlu
      • Copertă fină
      • Coperta tipărită
      • Husă combinată
      • Manta de praf
      • Pagina titlu
      • Shmuttitul
      • Legare
      • Forzaţ
    • Aspect cu ilustrații
      • Diverse tipuri de layout
      • Câteva caracteristici ale aspectului ilustrației
      • Instalarea imaginilor pe spread-uri
      • Mentinerea proportiilor
      • Legende pentru desene
    • Utilizarea corectă a hârtiei
  • CULOARE
    • Culoarea ca fenomen fizic
      • Culorile spectrului
      • Culoarea corpului
      • Caracteristicile culorii
      • Amestecarea culorilor
    • Culoare în artă și industrie
      • Contrast secvenţial
      • Contrast simultan
    • Armonii de culoare
      • Estetica culorii izolate
      • Armonii de culoare conform cercului Ostwald
      • Cerc egal
      • Armonii monocromatice
      • Convenția armoniilor de culori
    • Culoare în designul cărții
      • Design decorativ
      • Relația spațială a culorilor
      • Figura și pământul
      • Fundal și contur
      • Schimbarea culorii sub lumină artificială
    • Cerneluri de imprimare
      • Puterea de acoperire a vopselei
      • Rezistența la lumină a vopselei
      • Alte proprietăți ale vopselelor
      • Vopsele bicolore
    • Originale colorate
      • Originale în linie
      • Tonuri originale
      • Originale gravuroase
      • Originale pentru imprimare litografică
      • Originale pentru imprimare offset
    • Imprimare combinată multicolor
    • Calitatea reproducerii culorilor
  • FONT
    • Dezvoltarea fontului
      • Fonturi scrise de mână
      • Fonturi tipografice înainte de secolul al XIX-lea.
      • Dezvoltarea fonturilor în secolele al XIX-lea și al XX-lea.
      • Dezvoltarea fontului tipografic rusesc
    • Design font
      • Antiqua și grotesc
      • Caracteristicile fonturilor
      • Lățimea fontului
      • Font ca întreg constructiv
    • Fonturi de desen
      • Fonturi de desen - pagina 2
      • Spațiul dintre litere
      • Despre lățimea literelor
      • Fonturi scrise de mână
    • Relația dintre font și ilustrație
  • MATERIAL DE ILUSTRARE
    • Principii de bază ale ilustrației
    • Desen original
    • Desen linie și ton
    • Cerințe specifice pentru proiectarea manualelor și a cărților pentru copii
    • Reproducerea originalelor într-o singură culoare utilizând tipărirea tipografiei
    • Reproducerea originalelor într-o singură culoare utilizând metode de imprimare plată și intaglio
    • Desen tehnic
    • Redesenarea
  • Spațiul dintre litere

    Menținerea distanței corecte între litere este foarte importantă. Adesea se pot observa, pe de o parte, litere prea apropiate, iar pe de alta, intervale uriase, nejustificate, intre ele.

    În cuvântul „CÂND”, literele KOG sunt percepute vizual ca fiind deplasate, în timp ce există un decalaj între G și D, subliniat de convergența literelor D și L.

    Când compuneți un cuvânt din litere individuale, este necesar să țineți cont de zona optică ocupată de literă. În conformitate cu aceasta, defalcarea dintre litere se modifică. Când determinați defalcarea, puteți proceda de la dimensiunea lumenului. Potrivit lui Millet, lumenul este împărțit în patru părți. Cu două litere drepte, spațiul dintre ele este egal cu toate cele patru părți, iar cu alte litere, se folosește un sfert, jumătate sau trei sferturi din spațiu - după cum este necesar pentru a crea spații optic egale între litere. Distanța dintre cuvinte trebuie să fie egală cu lățimea normală a literei.

    Cu unele combinații de litere, spațiile dintre ele pot avea o valoare negativă, adică o literă se poate suprapune pe zona literei adiacente.

    Atunci când decideți cu privire la alinierea distanței dintre litere, este necesar să se țină seama de o trăsătură caracteristică a alfabetului rus, care îi conferă un caracter grafic diferit de cel latin: prezența unui număr de litere „deschise” către stânga.

    Există doar două astfel de litere în alfabetul latin - J, Z. Acest lucru creează o serie de combinații de litere dificile din punct de vedere grafic în textul rus când sunt juxtapuse cu o literă care este „deschisă” la dreapta și „deschisă” la stânga, pentru exemplu GL.

    Seara distanțelor dintre litere trebuie făcută în fonturi tipografice (de la kg. 16 și mai sus). Fonturile tipografice sunt turnate, cu puține excepții, fără a ține cont de spațierea dintre litere.

    Dacă într-o tipărire este ușor să uniformizați spațiile variind spațierea dintre literele individuale (cu ajutorul spațierii), atunci într-un font desenat manual, în caz de eșec, va trebui să refaceți întregul cuvânt și uneori întreaga linie.

    Prin urmare, atunci când desenați un font, este necesară o marcare preliminară atentă a intervalelor, ținând cont de natura literelor adiacente.

    Cu toate acestea, ar fi absolut greșit, atunci când compuneți o linie de font, să începeți să lucrați cu un calcul digital al intervalelor. Este necesar, în primul rând, să o construim cu ochii, să o rezolvi așa cum sugerează instinctul direct al artistului. Și abia apoi specificați matematic dimensiunile intervalelor (jumătate, sfert etc.).

    Se poate dovedi că în unele cazuri va fi necesar să se acorde nu un interval complet, ci trei sferturi din interval, sau nu un sfert, ci o treime din interval. Se recomandă să faceți marcajul nu imediat pe original, ci mai întâi pe o altă coală de hârtie.