Alinierea la stânga este infinită. Alinierea lățimii în Word. Cum să eliminați spațiile mari

Html există un parametru universal și se numește ALIGN. Poate fi folosit cu diverse etichete html:

p | h1 | div | masa | capul | tbody | tfoot | tr | a | td

Valori posibile:

Centru- alinierea la centru
Stânga- alinierea la stânga
Dreapta- pe dreapta
Justifica- în lățime, de-a lungul marginilor din stânga și din dreapta. În acest caz, pot apărea decalaje mari între cuvinte.

Textul este aliniat în lățime

Aspect în browser:

Titlul este centrat

Textul este aliniat în lățime. Textul este aliniat în lățime. Textul este aliniat în lățime. Textul este aliniat în lățime. Textul este aliniat în lățime. Textul este aliniat în lățime. Textul este aliniat în lățime. Textul este aliniat în lățime. Textul este aliniat în lățime. Textul este aliniat în lățime. Textul este aliniat în lățime. Textul este aliniat în lățime.

Conținutul acestui bloc este aliniat în partea dreaptă

Vă rugăm să rețineți că alinierea la stânga are loc automat. Prin urmare, nu este nevoie să specificați o astfel de valoare pentru parametrul de aliniere.

În cazul documentelor HTML, etichetele funcționează mai mult pentru a marca conținutul decât pentru a indica modul în care ar trebui să fie prezentat. Un control mai mare asupra prezentării este obținut cu stiluri. În acest articol mă voi uita la acele stiluri care sunt asociate cu formatarea paragrafelor în HTML.

Etichetă

În HTML, puteți specifica paragrafe, iar atributul de aliniere le aliniază la stânga, la dreapta, la centru sau justificat. Pe lângă ele, vom folosi atributul de stil global.

Alinierea paragrafelor

Puteți alinia un paragraf folosind atributul align cu următoarele valori:

text-align: stânga|dreapta|centru|justificare|inițial|moștenire;

Copiați următorul cod în fișierul dvs. .html.

Alinierea paragrafelor folosind atributul Stil

Acest paragraf este aliniat la centru

Acest paragraf este aliniat la dreapta

Acest paragraf apare justificat în fereastra browserului. Un paragraf justificat este aliniat la dreapta și la stânga prin adăugarea de spații suplimentare. Puteți vedea că marginile paragrafului justificat se potrivesc cu marginile paragrafelor aliniate la stânga și la dreapta. Într-un paragraf aliniat la stânga, marginea stângă este dreaptă, în timp ce într-un paragraf aliniat la dreapta, marginea stângă este dreaptă. Vedeți cum ambele margini ale acestui paragraf sunt drepte? Acest lucru se realizează prin stilul text-align:justify.

Într-o fereastră de browser, codul HTML pentru paragraf arată astfel:

Spațiere între linii

Puteți controla spația dintre liniile paragrafului folosind style=line-height . Utilizați atributul style cu următoarele valori:

line-height: normal|număr|lungime|inițial|moștenire;

Mai jos este un exemplu de cod HTML care afișează paragrafe cu spațiere între rânduri diferită:

Setarea spațierii liniilor folosind atributul Stil

Acest paragraf folosește două valori pentru atributul stil. Prima linie-height:1.5 specifică o spațiere între rânduri și jumătate pentru paragraf, iar a doua valoare text-align:justify specifică faptul că textul paragrafului trebuie să fie întins pe lățime.

Acest paragraf este la două spații și este justificat. line-height:2 specifică spațierea dublă. Atributul style nu trebuie să aibă două valori. Dar dacă trebuie să specificați două valori, puteți face acest lucru separându-le cu punct și virgulă.




Iată câteva moduri diferite de a utiliza valoarea înălțimii liniei pentru atributul stil:

: Setează distanța dintre linii la 13 pixeli;

: Setează distanța HTML între paragrafe la 200% față de dimensiunea curentă a fontului;

: Setează înălțimea liniei la 14 pixeli.

Indentări

Am folosit termenul „indentări” pentru a fi mai ușor de înțeles. Dar în HTML, folosim spațierea pentru a crea spațiu gol în jurul unui obiect. Puteți utiliza atributul de stil cu o valoare de umplutură pentru a indenta un paragraf la stânga sau la dreapta.

Mai jos este un exemplu de paragrafe cu indentare din stânga și din dreapta:

Indentați paragrafele folosind atributul Stil

Acest paragraf nu este indentat, este pur și simplu justificat. Uitați-vă la atributul de stil al elementului P pentru acest paragraf.

Pentru acest paragraf, am setat umplutura din stânga la 30 px folosind stilul padding-left:30px. Acest paragraf este, de asemenea, justificat folosind stilul text-align:justify. După cum știți deja, putem folosi mai multe valori pentru atributul Stil, separându-le cu punct și virgulă.

Și acest paragraf are o indentație din dreapta de 30 de pixeli, dar nicio indentație din stânga. Este, de asemenea, aliniat la lățime. Valoarea „padding-right” a atributului de stil specifică umplutura corectă. Dacă nu vedeți efectul, reduceți lățimea ferestrei browserului, astfel încât paragraful HTML justificat să fie afișat corect.


Indentație între paragrafe (indentație înainte și indentare după paragraf)

În HTML sau CSS nu avem nevoie de asta. Putem specifica pur și simplu stilul de umplutură pentru element

Padding-top și padding-bottom specifică spațiul alb înainte și după un paragraf, care acționează ca umplutură în partea de sus sau de jos. Uită-te la exemplul de etichetă de mai jos

Am setat primul paragraf HTML să aibă o umplutură de 10 pixeli înainte de al doilea paragraf și 50 de pixeli după al doilea paragraf:

Indentați paragrafele folosind atributul Stil

Acest paragraf nu are nicio indentare înainte sau după specificată. Acesta este un paragraf obișnuit, justificat. După cum știți deja, putem justifica un paragraf folosind codul style="text-align:justify" în interiorul etichetei.

Acest paragraf este exagerat. De asemenea, are 10 pixeli de umplutură înaintea paragrafului și 50 de pixeli după acesta. În interiorul etichetei am setat 3 stiluri.

Acesta este un paragraf obișnuit, fără indentări și aliniere implicită.




Lucruri de amintit

  • Un paragraf HTML poate fi aliniat folosind atributul align sau stilul text-align;
  • HTML va fi redat diferit în funcție de dimensiunile ecranului, dimensiunile ferestrei browserului;
  • Adăugarea de spații suplimentare sau linii goale la HTML nu afectează rezultatul. Browserul elimină toate spațiile suplimentare;
  • Etichetele definesc ce ar trebui să fie afișat, iar stilurile definesc modul în care ar trebui să fie afișat;
  • Stilurile pot fi specificate în trei moduri diferite - inline (în etichete), intern ( în interiorul aceluiași fișier HTML folosind elementul
    Aliniați textul la stânga

    Aliniați textul la stânga

    Exemplul nr. 2. Alinierea textului și a imaginilor la centru

    Aliniați textul la centru. Adesea folosit pentru titluri de articole sau pentru afișarea imaginilor în centru.

    Centrare alinierea textului

    Pagina se transformă în următoarele

    Aliniați textul la stânga

    Exemplul nr. 3. Aliniați textul la dreapta

    Aliniați textul la dreapta.

    Aliniați textul la dreapta

    Pagina se transformă în următoarele

    Aliniați textul la dreapta

    Exemplul nr. 4. Aliniați textul la lățimea întregii zone

    Aliniați textul la lățimea completă. Se pare că alinierea are loc atât la câmp, cât și la marginea dreaptă. Browserul adaugă automat spații.

    Pagina se transformă în următoarele

    Aliniați textul la lățimea întregii zone

    Uneori text-align: justificare; poate să nu funcționeze. Acest lucru are de-a face cu moștenirea și chiar cu modul în care funcționează browserul. În general, nu se recomandă utilizarea acestei opțiuni.

    Notă

    În loc de proprietatea text-align, puteți folosi și atributul align, care este scris împreună cu eticheta. Poate fi folosit cu diverse etichete. De exemplu:

    Alinierea la centru

    Aliniați textul la lățimea întregii zone

    ... ...

    Diferența de etichetă

    Și

    Faptul este că acesta din urmă face o tranziție la o nouă linie (indentație verticală), dar div nu.