Ce valori poate lua proprietatea de aliniere a textului. Proprietăți CSS: decorare text, aliniere verticală, aliniere text, indentare text pentru decorarea textului în html

Buna dragi cititori ai site-ului blogului. În acest articol, vom continua să explorăm elementele de bază ale stilării CSS și să aruncăm o privire asupra alinierii verticale, alinierii textului, a liniei de text și a altor câteva proprietăți pentru stilizarea textului html.

Alinierea textului cu CSS

Să începem cu atributele de stil care controlează redarea textului în elemente de bloc. Să începem cu proprietatea text-align, care este de fapt un înlocuitor pentru atributul align (folosit pentru a alinia conținutul elementelor html, cum ar fi paragrafele p).

Proprietate stil aliniere text întreabă alinierea orizontală a textuluiși are doar patru valori posibile:

Valorile disponibile pentru această regulă determină alinierea, respectiv: la stânga - la stânga, la dreapta - la dreapta, la centru - la centru și justifică - la lățimea paginii (simultan la stânga și la dreapta prin creșterea distanței dintre cuvinte). De exemplu, textul din acest articol este aliniat la lățimea paginii (dacă observați că are chiar margini atât la stânga, cât și la dreapta) utilizând regula de aliniere text: justificare.

În mod implicit, alinierea orizontală este aliniată la stânga, deci nu trebuie să specificați în mod specific text-align: left dacă nu a fost specificată nicio altă aliniere în elementele părinte.

Exemple de utilizare a proprietății:

Următoarea proprietate CSS text-ident întreabă liniuță pentru linia roșie, de exemplu pentru textul din eticheta de paragraf p. Această regulă, la fel ca text-align, se aplică numai elementelor de bloc. Sintaxă:

Aici sunt permise valorile de indentare absolute și relative. Valorile absolute (px - pixeli, em, ex etc.) pot fi specificate atât cu semnul plus, cât și cu minus. Valoarea relativă este de obicei dată ca procent (%). Valoarea relativă este calculată din lățimea zonei de text. Deci, regula CSS-indentare text: 50% va seta linia roșie egală cu jumătate din lungimea acestei linii. În mod implicit, linia „linia roșie” este zero. Exemplu:

În continuare, să analizăm alinierea verticală - proprietatea vertical-aliniat... Această proprietate este deja aplicabilă pentru toate elementele html și pentru aproape toate înseamnă alinierea elementelor inline cu textul în raport cu linia de bază a acestora. Cu excepția etichetelor de tabel td și th, în care tot conținutul va fi aliniat vertical. Sintaxă:

Să luăm în considerare fiecare valoare în detaliu:

linia de bază - alinierea unei bucăți de text cu linia de bază a elementului părinte. Aceasta este valoarea implicită;
sub - o bucată de text este afișată ca un indice sau un indiciu pentru elementul părinte;
super - o bucată de text este afișată ca un supercript sau un supercript pentru elementul părinte;
sus - aliniază o bucată de text la partea de sus a elementului părinte;
text-top - aliniază fragmentul la marginea superioară a textului elementului părinte;
mijloc - aliniază centrul fragmentului de text la centrul elementului părinte;
jos - aliniază o bucată de text la partea de jos a elementului părinte;
text-jos - alinierea fragmentului la marginea de jos a textului elementului părinte;

Figura de mai jos arată comportamentul fragmentelor de testare cu valori diferite ale proprietății de aliniere verticală în Internet Explorer 11:

În plus față de valorile de mai sus, puteți specifica valori numerice. De exemplu, regula CSS vertical-align: 0 ar însemna același lucru cu scrierea vertical-align: baseline. Și regula vertical-align: 10px va muta textul cu 10 pixeli în sus de la linia de bază. Pentru a muta textul în jos, valoarea trebuie specificată cu un minus.

Decalajul poate fi specificat și în unități relative, cum ar fi em și ex, sau ca procent.

Pentru a alinia vertical conținutul celulelor tabelului în aliniament vertical, utilizați următoarele valori:

sus - pentru a alinia conținutul la partea de sus a celulei;
jos - pentru a alinia conținutul la partea de jos a celulei;
mijloc - pentru a se alinia la centrul celulei (utilizat în mod implicit).

Pentru a obține rezultatul dorit, de obicei trebuie să experimentați diferite valori pentru proprietatea stilului de aliniere verticală. Numeroase valori posibile dau rezultate prea diferite în diferite cazuri.

Opțiuni de spațiu alb și de împachetare a cuvintelor pentru a controla întreruperile de linie

Următorul rând este parametrul de spațiu alb, care este responsabil pentru afișarea caracterelor de spațiu alb pe pagina html.

După cum știm, în mod implicit, browserul concatenează toate caracterele consecutive ale spațiului alb: spații, întreruperi de linie și file, într-un singur spațiu. O exceptie preetichetă, textul plasat în el este afișat așa cum este, cu toate spațiile.

Proprietatea de spațiu alb are următoarea sintaxă:

Este clar că valoarea normală este utilizată în mod implicit și lasă totul așa cum este descris mai sus, toate spațiile consecutive sunt combinate într-unul și întreruperile de linie sunt setate automat.

Folosirea valorii „pre” ar fi aceeași cu utilizarea etichetei „pre”. Browserul va reda pagina cu orice spații și cratime suplimentare adăugate de dezvoltator. Dacă o linie de text este prea lungă, se va adăuga o bară de defilare orizontală.

Valoarea nowrap împiedică browserul să împacheteze linii, iar textul este afișat pe o singură linie. Singurul lucru, adăugarea etichetei „br” vă va permite să înfășurați textul pe o nouă linie.

Valoarea pre-wrap păstrează toate secvențele de spații și întreruperi de linie, dar dacă linia nu se încadrează în zona specificată, browserul înfășoară automat textul pe o nouă linie.

Ei bine, valoarea pre-linie convertește spațiile într-un spațiu, fluxurile de linie sunt salvate și browserul poate rupe liniile care sunt prea lungi pentru a evita derularea orizontală.

Exemplu de utilizare:

Luați în considerare următorul parametru wrap wrap, care vă va spune dacă să înfășurați sau nu cuvinte lungi care nu se potrivesc în zona dată. Această proprietate nu este adesea folosită, dar uneori nu puteți face fără ea:

word-wrap: normal | break-word

Valoarea normală îi spune browserului că textul poate fi împărțit doar în spații, iar acesta este un comportament normal al browserului. Și valoarea cuvântului de pauză permite browserului să introducă pauze de linie în interiorul cuvintelor. Exemplu:

Parametrii umbrelor textului - proprietate text-umbră

Pentru fanii diverselor înfrumusețări din standardul CSS3, a devenit posibil să se stabilească o umbră pentru text. Utilizarea corectă a proprietății text-shadow poate anima vizibil o pagină web. Sintaxă:

Valoarea none anulează umbrirea textului și este setată implicit.

Culoarea nuanței este setat în orice format CSS disponibil și este un parametru opțional. În mod implicit, culoarea umbrelor este aceeași cu cea a textului.

Decalajul orizontal al umbrei poate fi specificat în orice unitate de măsură acceptată de CSS. O valoare pozitivă va poziționa umbra în dreapta textului și o valoare negativă în stânga. O valoare zero va poziționa umbra direct sub text și are sens numai dacă umbra este estompată.

Decalaj vertical al umbrei de asemenea, poate fi setat în orice unitate de măsură acceptată de CSS. O valoare pozitivă va muta umbra sub text; o valoare negativă o va muta deasupra. O valoare zero va poziționa umbra direct sub text.

În orice unitate de măsură și raza de estompare a umbrei... Cu cât valoarea este mai mare, cu atât umbra devine mai largă și cu atât mai netedă. Dacă acest parametru nu este setat, se presupune că valoarea neclară este zero. Deoarece algoritmul anti-aliasing este de obicei diferit pentru diferite browsere, aspectul umbrei poate diferi ușor în funcție de browser.

Modul Text CSS descrie funcțiile CSS care controlează traducerea textului sursă în text formatat și înfășurarea liniei. Diverse proprietăți CSS oferă control asupra conversiei carcasei, manipulării spațiilor, regulile de împărțire și împachetare pentru text și linii, alinierea, spațierea și indentarea.

Unitatea de bază a textului este un simbol. Cu toate acestea, întrucât sistemele de scriere nu sunt întotdeauna la fel de simple ca alfabetul englezesc principal, ceea ce este de fapt un simbol depinde de contextul în care este folosit termenul. De exemplu, în sistemul de scriere coreean, fiecare reprezentare pătrată a unei silabe (de exemplu, 한 \u003d han) poate fi considerată un simbol. Cu toate acestea, un simbol pătrat constă într-adevăr din mai multe litere, fiecare reprezentând un fonem (de exemplu, ㅎ \u003d h, ㅏ \u003d a, ㄴ \u003d n) și fiecare dintre ele poate fi, de asemenea, considerat un simbol.

1. Transformarea textului: proprietatea text-transform

Proprietatea de transformare a textului va stiliza textul. Nu afectează conținutul subiacent și nu ar trebui să afecteze conținutul unei operații de copiere și lipire text simplu.

Proprietatea este moștenită.

Sintaxă

Transformare text: niciuna; text-transform: capitalizează; text-transform: majuscule; text-transform: minuscule; text-transform: moșteni; text-transform: initial;

2. Gestionarea spațiilor și a întreruperilor de linie: proprietatea spațiului alb

Proprietatea de spațiu alb gestionează spațiile dintre cuvinte și pauzele de linie dintr-un element.

Proprietatea este moștenită.

spatiu alb
Valori:
normal	Valoare implicită. Se introduce un singur spațiu între cuvinte, spațiile suplimentare sunt aruncate. Textul este înfășurat numai dacă este necesar.
nowrap	Previne întreruperile de linie, cu excepția cazului în care este aplicat .
pre	Spațiile din text nu sunt ignorate, browserul afișează spații suplimentare și întreruperi de linie.
pre-împachetare	Păstrează spațiile din text făcând pauze de linie acolo unde este necesar.
pre-linie	Elimină spațiile suplimentare, cu excepția cazurilor .
spatii de spargere	Comportamentul este identic cu preînfășurarea, cu excepția faptului că: orice secvență de spațiu alb ne-amovibil ocupă întotdeauna spațiu, inclusiv la sfârșitul unei linii; întreruperea de linie există după fiecare spațiu nedemontabil, inclusiv între spații.
iniţială
moşteni

Sintaxă

Spațiu alb: normal; spațiu alb: nowrap; spațiu alb: pre; spațiu alb: pre-wrap; spațiu alb: pre-linie; white-space: spatii de spargere; spațiu alb: moșteni; spațiu alb: inițial;

3. Setarea filelor: proprietatea dimensiunii filelor

Proprietatea de dimensiune tab este utilizată pentru a modifica cantitatea de indentare obținută cu tasta Tab. Valorile proprietății sunt ignorate atunci când este setată una dintre cele trei valori pre-linie, normale sau nowrap ale proprietății spațiului alb.

Funcționează numai pentru elemente și <pre>Pentru restul elementelor bloc, valoarea va fi întotdeauna una. Valorile proprietăților specificate în unități de lungime sunt acceptate numai în Chrome 42+.</p> <p>Proprietatea este moștenită.</p> <p><b>Sintaxă</b></p><p>Dimensiune filă: 0; dimensiunea filei: 10 px; tab-size: mosteneste; tab-size: initial;</p><h3>4. Întreruperea liniei și limitele cuvintelor</h3> <p>Când conținutul la nivel de linie este împărțit în linii, acesta este împărțit în blocuri liniare. Această împărțire se numește întrerupere de linie.</p> <p>Când o linie se întrerupe din cauza controalelor explicite de întrerupere a liniei, cum ar fi linia nouă sau eticheta <br> , începutul sau sfârșitul unui bloc este o întrerupere forțată a liniei.</p> <p>Dacă o linie se întrerupe din cauza înfășurării de conținut atunci când browserul creează opțiuni de linie opționale pentru a se potrivi conținutului, aceasta este înfășurarea ușoară.</p> <h4>4.1. Regulile de pauză de litere: proprietatea de pauză de cuvinte</h4> <p>Proprietatea de rupere a cuvântului determină posibilitățile de înfășurare moale între litere, adică când este permisă împărțirea liniilor de text. În special, controlează dacă există cratimă ușoară între literele și / sau numerele tipografice adiacente. Acest lucru nu afectează regulile care reglementează capacitățile de cratimare ușoară create de spații.</p> <p>Proprietatea este moștenită.</p> <p><b>Sintaxă</b></p><p>Word-break: normal; pauză de cuvinte: break-all; pauză de cuvinte: păstrează-toate; pauză de cuvinte: moșteni; pauză de cuvânt: inițială;</p><h4>4.2. Break de linie: break-line</h4> <p>Proprietatea de întrerupere a liniei definește regulile pentru întreruperile de linie aplicate în cadrul unui element, în special modul în care interacțiunile de linie interacționează cu semnele de punctuație și caracterele.</p> <p>Proprietatea este moștenită.</p> <table class="t1"><tr><th colspan="2">linie-break</th> </tr><tr><td>Valori:</td> <td> </td> </tr><tr><td> auto</td> <td>Browserul definește un set de constrângeri de întrerupere a liniei de utilizat, care pot varia în funcție de lungimea liniei, cum ar fi utilizarea unui set mai puțin strict de reguli de întrerupere a liniilor pentru liniile scurte. Valoare implicită.</td> </tr><tr><td> slăbit</td> <td>Împarte textul utilizând cel mai puțin restrictiv set de reguli de împachetare a liniilor. De obicei utilizat pentru linii scurte, cum ar fi în ziare.</td> </tr><tr><td> normal</td> <td>Împarte textul folosind cel mai comun set de reguli de împachetare a liniilor.</td> </tr><tr><td> strict</td> <td>Descompune textul folosind un set strict de reguli de întrerupere a liniei.</td> </tr><tr><td> iniţială</td> <td>Setează valoarea proprietății la valoarea implicită.</td> </tr><tr><td> moşteni</td> <td>Moștenește valoarea proprietății de la elementul părinte.</td> </tr></table><p><b>Sintaxă</b></p><p>Break-line: auto; break-line: slăbit; break-line: normal; break-line: strict; break-line: moșteni; linie-break: inițială;</p><h4>4.3. Cratimare: proprietatea cratimelor</h4> <p>Proprietatea cratimelor determină dacă cratimele au permisiunea de a crea capabilități de cratimare ușoară într-o linie de text.</p> <p>Cratimarea este o separare controlată a cuvintelor, în care cuvintele nu au voie să se rupă pentru a îmbunătăți aspectul paragrafelor. De regulă, împărțirea cuvintelor are loc de-a lungul limitelor silabice sau morfemice și cu indicație vizuală de separare (de obicei prin inserarea unei cratime, -). În unele cazuri, cratima poate schimba și ortografia unui cuvânt. În orice caz, word wrap este doar un efect de redare: nu ar trebui să afecteze conținutul documentului, selectarea textului sau căutarea.</p> <p>Nivelul 3 al textului CSS nu definește reguli precise de cratimare, de aceea este recomandat să alegeți punctele de cratimare adecvate pentru limba dvs.</p> <p>Proprietatea este moștenită.</p> <table class="t1"><tr><th colspan="2">cratime</th> </tr><tr><td>Valori:</td> <td> </td> </tr><tr><td> nici unul</td> <td>Cuvintele nu sunt cratimate, chiar dacă caracterele din cuvânt definesc explicit cratimarea.</td> </tr><tr><td> manual</td> <td>Cuvintele sunt împărțite numai în acele locuri în care există caractere în interiorul cuvântului care indică în mod clar posibilitatea divizării cuvintelor (caracter special -). Valoare implicită.</td> </tr><tr><td> auto</td> <td>Cuvintele pot fi împărțite în capabilități de cratimare, determinate automat de resursa de cratimare adecvată limbii, în plus față de cele indicate în mod explicit de o cratimă cu cratimă. Trebuie să setați limba conținutului dvs. (de exemplu, utilizând atributul lang HTML sau antetul HTTP Content-Language) pentru a obține o înfășurare corectă a cuvintelor.</td> </tr><tr><td> iniţială</td> <td>Setează valoarea proprietății la valoarea implicită.</td> </tr><tr><td> moşteni</td> <td>Moștenește valoarea proprietății de la elementul părinte.</td> </tr></table><p><b>Sintaxă</b></p> <p>Cratime: niciuna; cratime: manual; cratime: auto; cratime: moștenesc; cratime: inițială;</p><h4>4.4. Wrap-block overflow: proprietate overflow-wrap / word-wrap</h4> <p>Proprietatea overflow-wrap (sau numele său depreciat word-wrap) specifică dacă o linie care nu se rupe se poate rupe în puncte nerezolvate pentru a împiedica revărsarea unei casete de linie. Funcționează atunci când proprietatea spațiului alb permite împachetarea.</p> <p>Proprietatea este moștenită.</p> <table class="t1"><tr><th colspan="2">overflow-wrap, word-wrap</th> </tr><tr><td>Valori:</td> <td> </td> </tr><tr><td> normal</td> <td>Liniile care nu se rup se pot sparge numai în punctele de rupere permise. Valoare implicită.</td> </tr><tr><td> break-word</td> <td> </td> </tr><tr><td> oriunde</td> <td>O secvență contiguă de caractere poate fi ruptă într-un punct arbitrar dacă nu există alte puncte de rupere acceptabile în linie. Afectează numai afișajul vizual, fără a afecta textul original. Nu se adaugă cratimă la întreruperea liniei. Opțiunile de învelire moale oferite oriunde sunt luate în considerare la calcularea propriilor dimensiuni minime de conținut.</td> </tr><tr><td> iniţială</td> <td>Setează valoarea proprietății la valoarea implicită.</td> </tr><tr><td> moşteni</td> <td>Moștenește valoarea proprietății de la elementul părinte.</td> </tr></table><p><b>Sintaxă</b></p><p>Overflow-wrap: normal; overflow-wrap: break-word; overflow-wrap: oriunde; overflow-wrap: moșteni; overflow-wrap: initial;</p><h3>5. Aliniați și justificați liniile</h3> <p>Alinierea și alinierea liniei controlează modul în care conținutul în linie este distribuit într-o casetă de linie.</p> <h4>5.1. O scurtă notă pentru alinierea textului: proprietatea text-align</h4> <p>Un bloc de text este o colecție de blocuri liniare. Proprietatea text-align setează text-align-all și text-align-last și descrie modul în care casetele la nivel de linie din fiecare casetă de linie sunt aliniate cu laturile de început și sfârșit ale casetei de linie. Alte valori decât justify-all sau match-parent sunt atribuite text-align-all și resetate la text-align-last la auto.</p> <p>Proprietatea este moștenită.</p> <table class="t1"><tr><th colspan="2">aliniere text</th> </tr><tr><td>Valori:</td> <td> </td> </tr><tr><td> start</td> <td>Conținutul la nivel de linie este aliniat cu marginea de început a casetei de linie. Valoare implicită.</td> </tr><tr><td> Sfârșit</td> <td>Conținutul la nivel de linie este aliniat la marginea finală a casetei de linie.</td> </tr><tr><td> stânga</td> <td>Conținutul la nivel de linie este aliniat la stânga liniei casetei de linie. În sistemele de scriere verticale, acesta va fi partea superioară sau inferioară fizică, în funcție de orientarea textului.</td> </tr><tr><td> dreapta</td> <td>Conținutul la nivel de linie este aliniat la dreapta pe caseta de linie a casetei de linie. În sistemele de scriere verticale, acesta va fi partea superioară sau inferioară fizică, în funcție de orientarea textului.</td> </tr><tr><td> centru</td> <td>Conținutul la nivel de linie este centrat în caseta de linie.</td> </tr><tr><td> justifica</td> <td>Textul este aliniat la lățimea casetei de linie pentru a umple cu precizie caseta de linie, amplasată pe marginile stânga și dreapta ale elementului părinte. Dacă nu se specifică altfel în text-align-last, ultima linie înainte de o pauză forțată sau de sfârșitul unui bloc este aliniată la început. Spațiile dintre cuvinte și litere sunt distribuite astfel încât lungimea tuturor liniilor să fie egală. Diferite browsere pot crește atât spațiul dintre cuvinte, cât și spațiul dintre litere.</td> </tr><tr><td> justifica-toate</td> <td>Setează text-align-all și text-align-last pentru a justifica, de asemenea alinierea ultimei linii.</td> </tr><tr><td> parinte potrivit</td> <td>Valoarea se comportă la fel ca mostenire, cu excepția faptului că valoarea de început sau de sfârșit moștenită este interpretată în raport cu valoarea direcției (sau blocul original care conține dacă nu există părinte) și are ca rezultat valoarea calculată la stânga sau la dreapta.</td> </tr><tr><td> moşteni</td> <td>Moștenește valoarea proprietății de la elementul părinte.</td> </tr></table><p><b>Sintaxă</b></p><p>Text-align: start; text-align: end; text-align: stânga; text-align: dreapta; text-align: centru; text-align: justifica; text-align: justify-all; text-align: match-parent; text-align: moșteni;</p><h4>5.2. Aliniere implicită a textului: proprietate text-align-all</h4> <p>Proprietatea text-align-all este o versiune prescurtată a proprietății text-align care determină alinierea tuturor liniilor de conținut din containerul blocului, cu excepția ultimelor linii, care sunt suprascrise de text-align-last. Acceptă valorile start, end, left, right, center, justify și match-parent.</p> <p>Proprietatea este moștenită.</p> <p><b>Sintaxă</b></p><p>Text-align-all: start; text-align-all: end; text-align-all: left; text-align-all: dreapta; text-align-all: centru; text-align-all: justify; text-align-all: match-parent; text-align-all: mostenesc;</p><h4>5.3. Aliniați ultima linie: proprietatea text-align-last</h4> <p>Proprietatea text-align-last descrie modul în care ultima linie a unui bloc sau linie este aliniată imediat înainte de o întrerupere forțată a liniei.</p> <p>Dacă este setat la automat, conținutul de pe linia corespunzătoare este aliniat cu text-align-all, cu excepția cazului în care justificare este setată pentru text-align-all, caz în care este aliniat la începutul blocului. Toate celelalte valori sunt interpretate așa cum este descris pentru alinierea textului.</p> <p>Valorile sunt auto, start, end, left, right, center, justify și match-parent.</p> <p>Proprietatea este moștenită.</p> <p><b>Sintaxă</b></p><p>Text-align-last: auto; text-align-last: start; text-align-last: sfârșit; text-align-last: stânga; text-align-last: dreapta; text-align-last: centru; text-align-last: justifica; text-align-last: match-parent;</p><h3>6. Lacune</h3> <p>CSS vă permite să controlați spațiul dintre cuvinte și caractere tipografice utilizând proprietățile de spațiere a cuvintelor și a literelor.</p> <h4>6.1. Spațiere între cuvinte: proprietatea de spațiere a cuvintelor</h4> <p>Proprietatea de spațiere a cuvintelor specifică spațierea suplimentară între cuvinte. <br> Setează spațiul dintre cuvinte. Se pot utiliza valori pozitive și negative. Cu un sens negativ, cuvintele se pot suprapune.</p> <p>Valoarea spațierii cuvintelor este afectată de valoarea proprietății text-align atunci când textul este justificat.</p> <p>Proprietatea este moștenită.</p> <p><b>Sintaxă</b></p><p>Spațiere cuvânt: normal; spațierea cuvintelor: 1 px; spațierea cuvintelor: 0.2em; spațierea cuvintelor: 50%; spațierea cuvintelor: moșteni; spațierea cuvintelor: inițială;</p><h4>6.2. Urmărire: proprietatea de spațiere a literelor</h4> <p>Proprietatea de spațiere a literelor definește spațiere suplimentară sau urmărire între caracterele tipografice adiacente. Spațierea literelor este complementară și spațierea cuvintelor. În funcție de regulile de aliniere existente, agenții utilizator pot crește sau micșora și mai mult spațiul dintre unitățile de caractere tipografice pentru a alinia textul.</p> <p>Proprietatea este moștenită.</p> <p><b>Sintaxă</b></p><p>Spațierea literelor: normală; spațierea literelor: 0,1em; spațierea literelor: 2 px; spațierea literelor: moșteni; spațierea literelor: inițială;</p><h3>7. Prima liniuță liniuță: proprietate text-liniuță</h3> <p>Proprietatea text-indent specifică indentarea aplicată liniilor de conținut în linie dintr-un bloc. Umplutura este tratată ca o marjă aplicată la marginea de început a casetei de linie. <br> Dacă există o imagine în prima linie a unui element de bloc, atunci aceasta se va deplasa împreună cu restul textului.</p> <p>Proprietatea este moștenită.</p> <p><b>Sintaxă</b></p><p>Indentare text: 5 mm; text-indent: 20px; text-indent: 5%; text-indent: 2em fiecare linie; text-indent: 2em suspendat; text-indent: moșteni; text-indent: initial;</p> <p>Setează alinierea ultimei linii a unui bloc de text.</p><h2>informatie scurta</h2><h2>Denumiri</h2><table><tbody><tr><th> </th><th>Descriere</th><th style="width: 130px">Exemplu</th> </tr><tr><td><тип> </td><td>Indică tipul valorii.</td><td><размер> </td> </tr><tr><td>A&&B</td><td>Valorile trebuie afișate în ordinea afișată.</td><td><размер> && <цвет> </td> </tr><tr><td>A | B</td><td>Indică faptul că trebuie selectată doar una dintre valorile sugerate (A sau B).</td><td>normal | litere mici</td> </tr><tr><td>A || B</td><td>Fiecare valoare poate fi utilizată singură sau împreună cu altele în orice ordine.</td><td>lățime || numara</td> </tr><tr><td> </td><td>Valorile grupurilor.</td><td>[cultură || cruce]</td> </tr><tr><td>* </td><td>Repetați zero sau de mai multe ori.</td><td>[,<время>]* </td> </tr><tr><td>+ </td><td>Repetați una sau mai multe ori.</td><td><число>+ </td> </tr><tr><td>? </td><td>Tipul, cuvântul sau grupul specificat sunt opționale.</td><td>medalion?</td> </tr><tr><td>(A, B)</td><td>Repetați cel puțin A, dar nu mai mult de B ori.</td><td><радиус>{1,4} </td> </tr><tr><td># </td><td>Repetați una sau mai multe ori, separate prin virgule.</td><td><время># </td> </tr></tbody></table>× <h2>Valorile</h2><p>auto Potrivește alinierea specificată de proprietatea text-align, cu excepția valorii justificate. Pentru aceasta, alinierea va fi ca începutul. start Linia este aliniată la marginea de început a blocului, care poate varia în funcție de direcția textului (de la stânga la dreapta sau de la dreapta la stânga). end Linia este aliniată la marginea de capăt a blocului, este determinată de direcția textului. stânga Linia este aliniată la stânga. dreapta Linia este aliniată la dreapta. centru Linia este centrată. justify Șirul este justificat. Dacă există un singur cuvânt în ultima linie, atunci acesta va fi lăsat justificat.</p><p>Influența diferitelor valori asupra poziției textului este prezentată în tabel. 1.</p><table class="data"> Tab. 1. Efectul valorilor text-align-last <tr><th>Valoare</th><th>Aliniere</th><th>Tipul textului</th> </tr><tr><td class="sel">stânga</td><td>Aliniere la stânga</td><td> </td> </tr><tr><td class="sel"> dreapta</td><td>Marginea dreaptă</td><td><img src='https://i2.wp.com/webref.ru/assets/images/css/css_text-align-last_2.png' height="127" width="161" loading=lazy></td> </tr><tr><td class="sel">centru</td><td>Centru</td><td><img src='https://i0.wp.com/webref.ru/assets/images/css/css_text-align-last_3.png' height="127" width="161" loading=lazy></td> </tr><tr><td class="sel">justifica</td><td>După lățime</td><td><img src='https://i0.wp.com/webref.ru/assets/images/css/css_text-align-last_4.png' height="127" width="161" loading=lazy></td> </tr></table><h2>Sandbox</h2><p>Winnie the Pooh nu a fost întotdeauna împotrivit unei mici băuturi răcoritoare, mai ales la ora unsprezece dimineața, pentru că la acea vreme micul dejun se terminase deja cu mult timp în urmă, iar cina nici nu se gândise să înceapă. Și, bineînțeles, a fost îngrozitor de fericit când l-a văzut pe Iepure scoțând cupe și farfurii.</p><p>div (text-align-last: start;)</p><h2>Exemplu</h2><p><!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>text-align-last</title> <style> div { width: 300px; text-align: justify; text-align-last: justify; } </style> </head> <body> <div> Când traversați munții, sprijiniți-vă pe vale; poziționați-vă la înălțimi, în funcție de locul în care este partea însorită. Când luptați cu un adversar care se află pe un deal, nu urcați direct în sus. Aceasta este dispoziția armatei în munți.</div> <script type="text/javascript">  </script><br> <br> </body> </html></p><h2>Model de obiect</h2><p><i>Un obiect</i>.style.textAlignLast</p><h2>Notă</h2><p>Internet Explorer și Edge nu acceptă valorile inițiale și finale.</p><p>Firefox versiunea 49 acceptă proprietatea -moz-text-align-last.</p><h2>Specificație</h2><p>Fiecare specificație trece prin mai multe etape de aprobare.</p><ul><li>Recomandare - Această specificație este aprobată de W3C și recomandată ca standard.</li><li>Recomandarea candidatului ( <span>Posibilă recomandare</span>) - grupul responsabil pentru standard este mulțumit că este în conformitate cu obiectivele sale, dar este nevoie de ajutorul comunității de dezvoltatori pentru implementarea standardului.</li><li>Recomandarea propusă ( <span>Recomandare sugerată</span>) - În acest moment, documentul este prezentat Consiliului consultativ al W3C pentru aprobare finală.</li><li>Proiect de lucru - O versiune mai matură a proiectului, după discuție și revizuire pentru revizuirea comunității.</li><li>Proiectul editorului ( <span>Proiect editorial</span>) - o versiune preliminară a standardului după editare de către editorii de proiect.</li><li>Proiect ( <span>Proiect de caiet de sarcini</span>) este prima versiune a standardului.</li> </ul>× <p><b>Etichete HTML care definesc alinierea textului, indentare</b></p> <p><b>Text justificat utilizat în tipografie</b></p> <p>Exemplul de mai jos arată cum să vă aliniați <b>text la lățime</b> pagini:</p> <table class="t_align" cellspacing="2"><tr><th> align \u003d "left"</th> <th> align \u003d "dreapta"</th> </tr><tr><td> </td> <td><p>Numărul lucrătorilor angajați în sectorul serviciilor și diseminarea informațiilor crește în fiecare zi. Dacă ferma și fabrica erau simbolurile secolelor trecute, atunci simbolul secolului actual 21 este un birou echipat cu computere care au acces la fluxul de informații.</p> </td> </tr><tr><th> align \u003d "justify"</th> <th> align \u003d "centru"</th> </tr><tr><td><p>Numărul lucrătorilor angajați în sectorul serviciilor și diseminarea informațiilor crește în fiecare zi. Dacă ferma și fabrica erau simbolurile secolelor trecute, atunci simbolul secolului actual 21 este un birou echipat cu computere care au acces la fluxul de informații.</p> </td> <td><p>Numărul lucrătorilor angajați în sectorul serviciilor și diseminarea informațiilor crește în fiecare zi. Dacă ferma și fabrica erau simbolurile secolelor trecute, atunci simbolul secolului actual 21 este un birou echipat cu computere care au acces la fluxul de informații.</p> </td> </tr></table><p>Valoarea justificativă asigură uniformitatea <b>aliniați textul la dreapta și la stânga</b>, adică <b>în lățime</b>... Această metodă este utilizată pe scară largă în imprimare.</p> <h2>Alinierea textului în centrul și lățimea HTML</h2> <p><b>Centrează alinierea textului în HTML, textul în dreapta</b>:</p> <p>Rezultat:</p> <p>Atribute și valori</p> <ul><li>align \u003d "left" - definește <i>aliniați textul la stânga</i> (Mod implicit).</li> <li>align \u003d "centru" - <i>aliniază textul la centru</i>.</li> <li>align \u003d "dreapta" - <i>aliniază textul la dreapta</i>.</li> </ul><h2>Alinierea | Indentare text HTML</h2> <p><b>Text HTML și indentarea acestuia în stânga paginii</b></p> <p>Vom produce <b>text de liniuță</b> în stânga în două moduri:</p> <p>Rezultat:</p> <p><img src='https://i0.wp.com/ab-w.net/images/501pr.png' width="100%" loading=lazy></p> <p>Vizualizați într-o fereastră nouă.</p> <p>Buna dragi cititori ai site-ului blogului. Astăzi continuăm să studiem și avem la rândul nostru proprietățile text-decor, vertical-align, text-align, text-indent și o serie de altele, care ajută la proiectarea aspectului textelor în cod HTML.</p><p>În ultimul articol, am analizat proprietățile care sunt destinate să personalizeze aspectul fonturilor atunci când.</p><p>Ei bine, și chiar mai devreme, am examinat toate tipurile în detaliu, am aflat cum pot fi grupate și ce priorități stabilește browserul atunci când le interpretează. Adevărat, toate acestea au fost împărțite în mai multe articole, așa că, pentru a nu vă confunda, vă sfătuiesc să studiați materialele în ordinea dată în.</p><h2>Decorarea textului, alinierea textului, indentarea textului în CSS</h2><p>Cum se lucrează cu text în CSS? Este logic să presupunem că există reguli special concepute în acest scop. Să începem cu text-align, care este de fapt un înlocuitor pentru atributul align (a fost folosit pentru alinierea conținutului, cum ar fi paragrafele P sau titlurile).</p><p>Are doar patru semnificații posibile:</p><p>Semnificația rămâne aceeași ca înainte. <b>Aliniere text</b> Este alinierea orizontală a liniilor. Această regulă se aplică numai elementelor de bloc (paragrafe, titluri etc.), adică acele etichete în care pot apărea mai multe linii. pentru că Deoarece nu pot exista doar un singur element în linie, nu are niciun sens deosebit în utilizarea text-align în ele.</p><p>Este clar că valorile acestei reguli înseamnă alinierea, respectiv: la stânga (stânga), la dreapta (dreapta), la centru (centru) și la lățimea paginii (Justificați - simultan la stânga și la dreapta prin creșterea distanței dintre cuvinte) ... Este de la sine înțeles că valoarea Justify ar trebui utilizată pentru elementele cu cel puțin mai multe rânduri de text, altfel nu va exista niciun efect vizibil din acest lucru.</p><p>De exemplu, am justificat paragraful anterior în lățime (puteți vedea că are chiar margini atât la stânga, cât și la dreapta) folosind:</p><p>Text-align: justifica;</p><p>În mod implicit, textul este aliniat orizontal la stânga, adică nu este nevoie să scrieți text-align: stânga în mod specific, cu excepția cazului în care, desigur, ați specificat anterior o altă aliniere. Apropo, am aliniat din nou acest paragraf în centru (centru) pentru un exemplu vizual, dar aici, cred, totul este clar.</p><p>Următoarea regulă CSS <b>text-indent</b> vă permite să setați o linie roșie, de exemplu, pentru textul într-o etichetă de paragraf P. Indentarea liniei roșii poate fi setată prin specificarea unei valori (atât cu un semn plus, cât și cu un semn minus, folosind) sau folosind procente:</p><p><img src='https://i1.wp.com/ktonanovenkogo.ru/image/text-indent.png' height="66" width="282" loading=lazy></p><p>Din ce procente se calculează din liniuța de text? Din lățimea zonei care este rezervată textului. Acestea. Regulă CSS indentare text: 50% va seta linia roșie egală cu jumătate din lungimea aceleiași linii. Ei bine, acest paragraf este doar un exemplu de astfel de regulă.</p><p>Sau puteți, de exemplu, setați o valoare negativă pentru linia roșie în liniuță de text, iar apoi vom obține ceva de genul a ceea ce vedeți în acest paragraf. Pentru a realiza acest lucru, am scris următoarea regulă CSS pentru eticheta de paragraf P:</p><p>Text-indent: -1em;</p><p>Ei bine, o utilizare obișnuită a text-indent (pentru a seta o linie roșie standard) ar putea arăta astfel: text-indent: 40px; (aplicat la acest paragraf apropo). Această regulă, la fel ca alinierea text discutată anterior, <b>se aplică numai elementelor de bloc</b>, adică unde pot apărea mai multe linii (paragrafe, titluri etc.).</p><p>Așa că acum să ajungem la <b>decor-text</b> (proiectare folosind o linie orizontală), care este deja aplicată tuturor elementelor HTML (atât în \u200b\u200blinie, cât și în bloc).</p><p>Poate avea doar patru semnificații:</p><p>Acestea. poate fi folosit cu decorarea textului: overline, line-through sau subliniat, sau nu utilizați deloc. Unele elemente HTML au deja o linie orizontală în mod implicit, de exemplu (sunt subliniate în mod implicit).</p><p>Prin urmare, evidențierea altceva cu subliniere (cu excepția hyperlinkurilor) nu este bună, deoarece în mintea subconștientă a utilizatorilor este scris că odată ce este subliniat (și, de asemenea, evidențiat în culori), înseamnă că puteți face clic pe aceasta pentru a merge. Dar prin evidențierea textului normal cu subliniere, înșelați utilizatorul și dezamăgirea ulterioară cu resursa dvs. (s-a gândit, dar sa dovedit că ...).</p><p>O nuanță în utilizarea regulii de decorare a textului CSS este că puteți scrie trei (sau două) valori simultan pentru orice element Html (omițând niciuna) și, ca rezultat, veți obține <span>fragment de text subliniat-subliniat-trasat</span> (sună mișto și arată, nu-i așa?):</p><p>Decorarea textului: subliniați linia liniară;</p><p>Valorile pentru decorarea textului (dacă doriți să utilizați mai multe dintre ele simultan) ar trebui să fie scrise <b>separate prin caracter spațial</b>.</p><h2>Vertical-align - aliniere verticală</h2><p>Apoi avem aliniere verticală - vertical-align. Pentru aproape toate elementele din codul HTML, înseamnă alinierea elementelor inline cu textul în raport cu linia de bază a acestora. Este adevărat, pentru asta înseamnă puțin diferit - tot conținutul din aceste celule va fi aliniat vertical.</p><p>Pentru CSS, regula de aliniere verticală poate utiliza următoarele valori:</p><p>Liniile sunt aliniate implicit la linia de bază. Uite, am aplicat <span>la această bucată de text creșteți fontul</span> iar aceste două piese sunt aliniate cu linia de bază (de jos). Iar alinierea verticală cu alinierea verticală este destinată tocmai pentru a schimba modul în care sunt aliniate liniile.</p><p>De exemplu, dacă scriu vertical-align: baseline pentru aceeași bucată de text mărită, atunci nu se vor mai întâmpla modificări, din moment ce valoarea de bază este utilizată pentru această regulă implicită CSS.</p><p>Apropo, numerele pot fi folosite și ca valori pentru aceasta, iar inscripția vertical-align: 0 va însemna același lucru ca vertical-align: linia de bază, adică valoarea de referință este egală cu zero. Prin urmare, dacă dorim să indicăm orice deplasare în aliniamentul vertical, atunci această deplasare va fi indicată în raport cu linia de bază (sau zero).</p><p>Puteți scrie astfel:</p><p>Aliniere verticală: 10 px;</p><p>Și obținem <span>deplasarea fragmentului cu fontul mărit în sus</span> 10 pixeli de la linia de bază. Dacă scriem o valoare negativă:</p><p>Aliniere verticală: -10px;</p><p>Atunci ajungem <span>deplasând fragmentul în jos</span> relativ la linia de bază. Exemplele arată că, din cauza deplasării, înălțimea liniei a crescut, astfel încât textul să se potrivească în ea fără să se lovească de linia adiacentă. Deplasarea poate fi setată și în Em și Ex, bine, și ca procent, care va fi numărată de la înălțimea liniei acestui element (amintiți-vă în ultimul articol am învățat cum să o setați folosind).</p><p>Pentru a alinia vertical conținutul celulelor de tabel în vertical-align, ar trebui să utilizați valorile de sus și de jos pentru a obține conținutul aliniat la partea de sus și de jos a celulei, respectiv (bine, mijlocul unei celule de tabel este utilizat ca valoare implicită de aliniere verticală).</p><p>Și pentru elementele de font, puteți utiliza text-sus, text-jos, mijloc. Să aplicăm de exemplu la <span>această bucată de text</span> valoare:</p><p>Vertical-align: mijloc;</p><p>Ce s-a întâmplat ca urmare? Linia de mijloc a fragmentului mărit este aliniată cu linia de bază a textului normal, adică avem o aliniere verticală a liniei centrale. Pentru textul de sus și textul de jos totul va fi la fel. Acesta este text-top, la fel și text-bottom.</p><p>Valorile Css ale proprietății sub și super aliniază vertical corespund cu sub și supercript, care au avut loc în Html pur (înainte de a utiliza proprietățile CSS pentru proiectarea vizuală).</p><h2>Transformarea textului, spațierea literelor, spațierea cuvintelor și spațiul alb</h2><p>Niciuna nu este utilizată în mod implicit și înseamnă că caracterele din text nu se vor schimba în niciun fel - așa cum este scris în Html, acestea vor fi afișate. Valoarea majusculă pentru transformarea textului va transforma toate literele din fragment în majuscule ( <span>un exemplu este prezentat în această propoziție</span>, unde a fost utilizată regula text-transform: majuscul, iar literele au fost scrise inițial cu litere mici).</p><p>Valoarea minusculă pentru regula de transformare a textului CSS vă va permite să transformați toate caracterele din fragment în minuscule, bine, iar valoarea cu majuscule va face ca toate primele litere ale cuvântului să fie majuscule ( <span>exemplu în această propoziție</span> - text-transform: majuscule). Acestea. folosind text-transform, puteți face orice cu text simplu și apoi puteți pune cu ușurință totul înapoi.</p><p>Prin urmare, dacă, de exemplu, aveți o sarcină de a face toate titlurile scrise numai cu majuscule, atunci în Html scrieți-le de obicei și faceți-le cu majuscule în CSS folosind text-transform: majuscule. Apoi, dacă decideți să schimbați ceva înapoi, atunci este suficient să faceți doar o mică schimbare în stiluri și nu în conținutul tuturor celor 100.500 de rubrici de pe site-ul dvs.</p><p><img src='https://i0.wp.com/ktonanovenkogo.ru/image/letter-spacing.png' height="91" width="358" loading=lazy></p><p>În mod implicit, atât spațierea literelor, cât și spațierea cuvintelor sunt setate la Normal, sau este același cu zero (adică distanța dintre caractere și cuvinte nu se schimbă în niciun fel). Mărimea modificării distanței în aceste reguli poate fi indicată numai în pixeli, fie Em, fie Ex, dar nu în procente.</p><p>Cu toate acestea, puteți utiliza atât valori pozitive (raritatea caracterelor sau cuvintelor), cât și valori negative (convergența caracterelor sau cuvintelor). De exemplu, puteți <span>„Așa ca să sparg personajele din această frază”</span> folosind următoarea regulă CSS:</p><p>Spațierea literelor: 0,4em;</p><p>Sau puteți <span>„Ca asta pentru a aduce personajele împreună în această frază”</span> prin:</p><p>Spațierea literelor: -1px;</p><p>Același lucru se poate spune despre spațierea cuvintelor, cu singura diferență că distanța se va schimba între cuvinte, <span>ca, de exemplu, în această frază, folosind această construcție CSS</span>:</p><p>Spațierea cuvintelor: 4em;</p><p>În mod similar, valorile negative pot fi utilizate în spațierea cuvintelor pentru a reduce distanța dintre cuvinte.</p><p>Ei bine, iar ultima regulă CSS de astăzi, care vă permite să stilizați textul într-un anumit mod în codul HTML, este <b>spatiu alb</b>... Este responsabil pentru afișarea caracterelor de spațiu alb pe o pagină web, care a avut loc la scrierea codului HTML.</p><p>După cum vă amintiți din articolul despre, browserul, când analizează codul, combină toate spațiile, întreruperile de linie și filele într-un singur spațiu și efectuează întreruperile de linie pe pagina web exact după spațiile albe care au avut loc în cod.</p><p>Deci, spațiul alb poate lua una din cele trei valori:</p><p><img src='https://i2.wp.com/ktonanovenkogo.ru/image/white-space.png' width="100%" loading=lazy></p><p>Este clar că valoarea implicită este Normal și în acest caz totul este afișat așa cum am descris chiar mai sus. Dar când folosim valoarea Pre, obținem o analogie completă cu utilizarea, adică pe pagina web, textul va fi afișat cu toate acele caractere spațiale albe care au avut loc la scrierea codului, iar browserul nu va putea face transferuri pe ele.</p><p>Ei bine, și sensul <b>nowrap</b> va împiedica pur și simplu browserul să se împacheteze pe spațiul alb pe care îl găsește într-un spațiu alb: nowrap fragment CSS. Puteți încerca, de asemenea, cum funcționează totul, creând un fișier HTML simplu și încorporând orice bucată de text în astfel de etichete:</p><p> <div style="white-space:pre;">fragment de text de testare</div> </p><p>Multă baftă! Ne vedem în curând pe paginile site-ului blogului</p><h3></h3><p>S-ar putea să fii interesat</p><p><img src='https://i2.wp.com/ktonanovenkogo.ru/wp-content/uploads/2013/10/list-style.jpg' width="100%" loading=lazy><span>Stilul listei (tip, imagine, poziție) - reguli CSS pentru personalizarea aspectului listelor în codul HTML</span> <br><img src='https://i1.wp.com/ktonanovenkogo.ru/wp-content/uploads/2013/10/z-index-cursor.jpg' width="100%" loading=lazy><span>Poziționarea cu indexul Z și regula CSS Cursor pentru a schimba cursorul mouse-ului</span> <br><img src='https://i1.wp.com/ktonanovenkogo.ru/wp-content/uploads/2013/10/padding-margin-border.jpg' width="100%" loading=lazy><span>Căptușire, margine și margine - stabilim margini interne și externe în CSS, precum și margini pentru toate laturile (sus, jos, stânga, dreapta)</span> <br><img src='https://i0.wp.com/ktonanovenkogo.ru/wp-content/uploads/2013/10/uroki-css.jpg' width="100%" loading=lazy><span>Pentru ce este CSS, cum să conectați foi de stil în cascadă la un document HTML și elementele de bază ale sintaxei acestui limbaj</span> <br><img src='https://i2.wp.com/ktonanovenkogo.ru/wp-content/uploads/2013/10/float-clear.jpg' width="100%" loading=lazy><span>Plutire și clar în CSS - instrumente de aspect bloc</span> <br><img src='https://i2.wp.com/ktonanovenkogo.ru/wp-content/uploads/2013/10/css.jpg' width="100%" loading=lazy><span>CSS - ce este, cum se leagă foile de stil în cascadă de codul html folosind Style și Link</span> <br><img src='https://i0.wp.com/ktonanovenkogo.ru/wp-content/uploads/2013/10/razmery-nasledovanie-css.jpg' width="100%" loading=lazy><span>Unități de dimensiune (pixeli, Em și Ex) și moștenirea regulilor CSS</span> <br><img src='https://i0.wp.com/ktonanovenkogo.ru/wp-content/uploads/2013/10/css-selektory.jpg' width="100%" loading=lazy><span>Selectoare de etichete, clase, Id și generice, precum și selectoare de atribute în CSS modern</span> <br><img src='https://i1.wp.com/ktonanovenkogo.ru/wp-content/uploads/2013/10/position-css.jpg' width="100%" loading=lazy><span>Poziție (absolută, relativă și fixă) - modalități de poziționare a elementelor HTML în CSS (reguli stânga, dreapta, sus și jos)</span> <br><img src='https://i0.wp.com/ktonanovenkogo.ru/wp-content/uploads/2013/10/background-color.jpg' width="100%" loading=lazy><span>Fundal în CSS (culoare, poziție, imagine, repetare, atașament) - totul pentru setarea culorii de fundal sau a imaginii de fundal a elementelor HTML</p> <script>document.write("<img style='display:none;' src='//counter.yadro.ru/hit;artfast_after?t44.1;r"+ escape(document.referrer)+((typeof(screen)=="undefined")?"": ";s"+screen.width+"*"+screen.height+"*"+(screen.colorDepth? screen.colorDepth:screen.pixelDepth))+";u"+escape(document.URL)+";h"+escape(document.title.substring(0,150))+ ";"+Math.random()+ "border='0' width='1' height='1' loading=lazy>");</script> </div> <div class="dsperelink"> <div class="read-analog"> <style> </style> <style> #perelink-horizontal { vertical-align: top; margin: 0 -5px; text-align: left; } #perelink-horizontal .perelink-horizontal-item { vertical-align: top; display: inline-block; width: 192px; margin: 0 5px 10px; } #perelink-horizontal .perelink-horizontal-item a span { display: block; margin-top: 10px; } #perelink-horizontal img { width: 192px; height: 192px; margin-bottom: 10px; } </style> <div id="perelink-horizontal"> <div class="perelink-horizontal-item"> <a href="https://olympsb.ru/ro/samsung-galaxy-j5-harakteristiki-razmer-matricy-obzor-samsung-galaxy-j5-2016-sm-j510fn-novoi.html"> <img src="/uploads/364026a86b88ecb3a9cb0987483cf1c5.jpg" height="192" width="192" loading=lazy> <span>Revizuire a Samsung Galaxy J5 (2016) SM-J510FN, noua versiune a fundalului selfie mid-range</span> </a> </div> <div class="perelink-horizontal-item"> <a href="https://olympsb.ru/ro/samsung-galaxy-j5-harakteristiki-razmer-matricy-obzor-samsung-galaxy-j5-2016-sm-j510fn-novoi.html"> <img src="/uploads/364026a86b88ecb3a9cb0987483cf1c5.jpg" height="192" width="192" loading=lazy> <span>Revizuire a Samsung Galaxy J5 (2016) SM-J510FN, noua versiune a fundalului selfie mid-range</span> </a> </div> <div class="perelink-horizontal-item"> <a href="https://olympsb.ru/ro/galaxy-s9-cvet-kakoi-vybrat-chernyi-fioletovyi-sinii-ili-seryi-vse-cveta.html"> <img src="/uploads/679b4f32b7d3d0a7b43b46354f002388.jpg" height="192" width="192" loading=lazy> <span>Toate culorile caroseriei Galaxy S9 - pe care ar trebui să o alegeți?</span> </a> </div> <div class="perelink-horizontal-item"> <a href="https://olympsb.ru/ro/galaxy-s9-cvet-kakoi-vybrat-chernyi-fioletovyi-sinii-ili-seryi-vse-cveta.html"> <img src="/uploads/679b4f32b7d3d0a7b43b46354f002388.jpg" height="192" width="192" loading=lazy> <span>Toate culorile caroseriei Galaxy S9 - pe care ar trebui să o alegeți?</span> </a> </div> </div> </div> </div> </div> </article> </div> </section> <aside class="col-xs-12 col-sm-3 sidebar-offcanvas" id="sidebar" role="navigation"> <div class="mainnavbar side-box clear"> <div id="nav_menu-2" class="side-box_b"> <div class="menu-sidenav-container"> <ul id="menu-sidenav" class="menu"> <li id="menu-item-" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-"><a href="https://olympsb.ru/ro/category/total/">General</a></li> <li id="menu-item-" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-"><a href="https://olympsb.ru/ro/category/hard-drive/">HDD</a></li> <li id="menu-item-" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-"><a href="https://olympsb.ru/ro/category/different/">miscellanea</a> </li> <li id="menu-item-" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-"><a href="https://olympsb.ru/ro/category/windows/">Windows</a></li> <li id="menu-item-" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-"><a href="https://olympsb.ru/ro/category/apple/">măr</a></li> <li id="menu-item-" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-"><a href="https://olympsb.ru/ro/category/android/">Android</a> </li> <li id="menu-item-" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-"><a href="https://olympsb.ru/ro/category/browsers/">Browsere</a> </li> </ul> </div> </div> </div> <div class="side-box lastfaq faqli clear"> <span class="title-f">TOP 5:</span> <ul class="textw_a clear"> <li><a href="https://olympsb.ru/ro/planshety-s-vysokim-razresheniem-ekrana-planshety-planshetnye-kompyutery.html">Tablete (tablete)</a></li> <li><a href="https://olympsb.ru/ro/planshety-s-vysokim-razresheniem-ekrana-planshety-planshetnye-kompyutery.html">Tablete (tablete)</a></li> <li><a href="https://olympsb.ru/ro/instrukciya-obsluzhivaniya-htc-one-m8-instrukciya-obsluzhivaniya-htc.html">Manual de utilizare HTC One M8 Merită, de asemenea, să vă uitați la recenziile telefonului mobil</a></li> <li><a href="https://olympsb.ru/ro/instrukciya-obsluzhivaniya-htc-one-m8-instrukciya-obsluzhivaniya-htc.html">Manual de utilizare HTC One M8 Merită, de asemenea, să vă uitați la recenziile telefonului mobil</a></li> <li><a href="https://olympsb.ru/ro/kogda-vyidet-samsung-galaxy-a7-obzor-samsung-galaxy-a7-2017-ne-boitsya-vody-i-ekonomii-s-health.html">Recenzie Samsung Galaxy A7 (2017): nu vă temeți de apă și economie</a></li> </ul> </div> <div class="side-box lastfaq faqli clear"> <span class="title-f">Ultimele materiale:</span> <ul> <li> <a href="https://olympsb.ru/ro/kogda-vyidet-samsung-galaxy-a7-obzor-samsung-galaxy-a7-2017-ne-boitsya-vody-i-ekonomii-s-health.html" >Recenzie Samsung Galaxy A7 (2017): nu vă temeți de apă și economie</a> </li> <li> <a href="https://olympsb.ru/ro/instrukciya-po-ekspluatacii-huawei-mediapad-t3-10.html" >Manual de utilizare Huawei mediapad t3 10</a> </li> <li> <a href="https://olympsb.ru/ro/instrukciya-po-ekspluatacii-huawei-mediapad-t3-10.html" >Manual de utilizare Huawei mediapad t3 10</a> </li> <li> <a href="https://olympsb.ru/ro/telefony-ldzhi-na-2-sim-karty.html" >Telefoane lji pentru 2 cartele SIM</a> </li> <li> <a href="https://olympsb.ru/ro/telefony-ldzhi-na-2-sim-karty.html" >Telefoane lji pentru 2 cartele SIM</a> </li> </ul> </div> <div class="side-box clear"> <div id="rexuta2" style="height:800px;width:240px;" align="center"></div> </div> </aside> </section> <div class="footer"> <div id="footer_mainnav" class="mainnav collapse navbar-collapse col-xs-12 col-sm-12"> <ul id="menu-mainnav-1" class="nav navbar-nav navi"> <li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-"><a href="https://olympsb.ru/ro/category/flash-drives/">Unități flash</a></li> <li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-"><a href="https://olympsb.ru/ro/category/total/">General</a></li> <li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-"><a href="https://olympsb.ru/ro/category/hard-drive/">HDD</a></li> <li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-"><a href="https://olympsb.ru/ro/category/different/">miscellanea</a></li> <li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-"><a href="https://olympsb.ru/ro/category/windows/">Windows</a></li> </ul> </div> <div class="twobl-footer col-xs-12 col-sm-12"> <div class="onef col-xs-12 col-sm-3"> <div class="fool2og log-m_h1"> <img src='/public/logo.png' loading=lazy> </div> <div class="decksite"></div> </div> <div class="twof col-xs-12 col-sm-2"> <ul id="menu-foonav" class="twonavig"> <li id="menu-item-" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-"><a href="https://olympsb.ru/ro/category/apple/">măr</a></li> <li id="menu-item-" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-"><a href="https://olympsb.ru/ro/category/android/">Android</a></li> <li id="menu-item-" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-"><a href="https://olympsb.ru/ro/category/browsers/">Browsere</a></li> <li id="menu-item-" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-"><a href="https://olympsb.ru/ro/category/flash-drives/">Unități flash</a></li> </ul> </div> <div class="treef col-xs-12 col-sm-4"> <ul class="f-post"> <li><a href="https://olympsb.ru/ro/obzor-smartfona-lg-optimus-l5-chetyre-nedorogih-dyuima-obzor-smartfona-lg.html">Recenzie smartphone LG Optimus L5: patru centimetri ieftini ⇡ despre putere</a></li> <li><a href="https://olympsb.ru/ro/obzor-smartfona-lg-optimus-l5-chetyre-nedorogih-dyuima-obzor-smartfona-lg.html">Recenzie smartphone LG Optimus L5: patru centimetri ieftini ⇡ despre putere</a></li> <li><a href="https://olympsb.ru/ro/smartfon-huawei-honor-8-lite-belyi-dizain-razmery-upravlyayushchie-elementy.html">Proiectare, dimensiuni, comenzi</a></li> <li><a href="https://olympsb.ru/ro/smartfon-huawei-honor-8-lite-belyi-dizain-razmery-upravlyayushchie-elementy.html">Proiectare, dimensiuni, comenzi</a></li> </ul> </div> <div class="fourf col-xs-12 col-sm-3"> <div class="buth"> <a class="butt-faq buttorang" href="" title="contacte">Contacte</a> </div> <p class="continfo">Ajutor computer Olympus</div> </div> <div class="tree-footer col-xs-12 col-sm-12 clear"> © 2020. olympsb.ru. Ajutor computer Olympus.</div> </div> <script src="https://olympsb.ru/wp-content/themes/vsepropechen/js/bootstrap.min.js"></script> <script type='text/javascript' src='https://olympsb.ru/wp-content/plugins/contact-form-7/includes/js/jquery.form.min.js?ver=3.51.0-2014.06.20'></script> <script type='text/javascript' src='https://olympsb.ru/wp-content/plugins/contact-form-7/includes/js/scripts.js?ver=4.5.1'></script> <script type='text/javascript' src='https://olympsb.ru/wp-content/plugins/wp-postratings/postratings-js.js?ver=1.83'></script> <script type='text/javascript' src='/wp-includes/js/wp-embed.min.js?ver=4.7.6'></script> <script type='text/javascript' src='https://olympsb.ru/wp-content/plugins/disqus-comment-system/media/js/disqus.js?ver=4.7.6'></script> <script type='text/javascript' src='https://olympsb.ru/wp-content/plugins/disqus-comment-system/media/js/count.js?ver=4.7.6'></script> <div style="display:none"> <div id="text-3" class="conter-metr"> <div class="textwidget"> </script> </div> </div> </div> <div id="top-link"> <a href="https://olympsb.ru/ro/#top"></a> </div> <script type="text/javascript">  </script><br> <br> </body> </html> </div>