Care etichetă este scrisă în cursiv. Etichete de formatare a textului HTML de bază - evidențierea textului cu caractere aldine și cursive; opțiuni de dimensiune, culoare și font; etichete de paragraf și titlu

Pentru ca pagina noastră WEB să pară mai prezentabilă, împărțim textul în paragrafe și evidențiem titlul. HTML are 6 niveluri de titluri de secțiune a documentului, numerotate de la 1 la 6. Titlurile sunt declarate printr-o pereche de etichete cu numere corespunzătoare nivelului, de exemplu,

- antetul secției de la primul nivel și
- antetul secțiunii de nivelul șase. Titlurile diferă de textul obișnuit prin dimensiunea și lățimea literelor. Titlul de la primul nivel h1 este de obicei afișat într-un font foarte mare, în timp ce titlul de al șaselea nivel h6 este afișat foarte mic.

Titluri

Nu confundați titlurile secțiunilor unui document cu titlul documentului discutat anterior, definit de element .

Folosim prima propoziție ca titlu al textului - Pentru a face acest lucru, este suficient să o limităm cu etichete

Și

.

Inserați etichete în textul fișierului other.html

Și

astfel încât acestea limitează prima propoziție a textului, iar această bucată de cod ia următoarea formă:

Bun venit pe pagina companiei SD!

Să ne uităm la rezultatul obținut.

Salvați fișierul selectând comanda din meniul programului Notepad File - Save (File - Save).

Operația de salvare trebuie făcută întotdeauna înainte de vizualizarea documentului, deoarece deschide fișierul pentru vizualizare încărcându-l în memoria RAM a computerului de pe disc. Dacă nu salvați fișierul după editarea codului HTML, nu veți vedea nicio configurație în browser.

Restaurați fereastra browserului făcând clic pe butonul acesteia din bara de activități.

Apăsați butonul F5 sau butonul Reîmprospătare de pe bara de instrumente a ferestrei de lucru a programului. Fișierul other.html va fi reîncărcat și veți vedea în fereastra browserului cum arată titlul de la primul nivel.

Vedeți cum vor arăta titlurile celorlalte 5 niveluri schimbând numerele din etichete: h2, h3 și așa mai departe După fiecare configurare, nu uitați să salvați fișierul și să reîmprospătați imaginea în fereastra browserului.

Când terminați experimentele, restaurați din nou etichetele din fișierul other.html

.

Folosind cele 6 nivele de titluri oferite de HTML, puteți pur și simplu document lizibil cu o structură intuitivă. Amintiți-vă că documentul dvs. va citi întotdeauna mult mai bine dacă are o împărțire precisă în secțiuni și subsecțiuni.

Alinierea capului

În mod implicit, antetul este aliniat la stânga paginii. Dar poate fi și aliniat la dreapta sau centrat. Pentru alinierea la dreapta într-o etichetă

se folosește atributul align="right" și align="center" pentru centrare. Este permisă și indicația evidentă a alinierii pe partea stângă - align="left".

Adaugă la etichetă

atributul align="center" pentru a centra titlul. Acest element ar trebui să ia următoarea formă:

Bun venit pe pagina companiei SD!

Pe viitor, nu vă vom aminti de necesitatea de a salva fișierul cu codul inițial și de a actualiza imaginea în browser înainte de vizualizare.

Cum să faci textul aldine în HTML

Acum să trecem la restul textului. Măriți-i dimensiunea și faceți textul aldine italic. Etichetele pereche sunt folosite pentru a seta stilul îndrăzneț .

Lipiți în fișierul de deschidere other.html si inchidere etichete astfel încât să limiteze textul Aici veți învăța... Acest element ar trebui să ia următoarea formă:

Cum se face textul italic în HTML

Stilul italic este setat folosind etichete .

Introduceți o etichetă HTML în codul inițial Și astfel încât elementul editat să ia următoarea formă:

Aici veți afla despre activitățile noastre, despre produsele software ale companiei noastre și despre echipamentele pe care le producem.

Elementele de marcare pot fi imbricate, ca în această structură, unde elementul … imbricat în element …. Browserele moderne sunt capabile să gestioneze corect etichetele imbricate. Prin urmare, trebuie să vă asigurați că ordinea de cuibărit nu este încălcată. Browserul va fi împiedicat dacă imbricarea este întreruptă. De exemplu, următoarele ar fi incorecte: …. Imbricarea este o parte foarte fundamentală a culturii generale de scriere a codului HTML.

Cum să faci text subliniat în HTML

Cu câteva etichete puteți seta stilul de subliniat al unei părți de text delimitată de aceste etichete și folosind o pereche de etichete - afișați textul în font teletype.

De remarcat faptul că recent eticheta simplificată și sublinierea se face folosind stiluri. echivalent . Da, noul analog pare mai greoi, dar, din păcate, este mai adevărat. Principalul lucru în această favoare este că varianta voluminoasă este cross-browser, cu alte cuvinte, este potrivită pentru toate browserele, când ambele Nu toate browserele acceptă.

Cum să incrementați textul în HTML

Acum să mărim dimensiunea fontului textului. Acest lucru se poate face în diferite moduri.

Etichete măriți dimensiunea fontului textului cuprins între ele.

Adăugați etichete la începutul și, respectiv, la sfârșitul piesei de cod de mai sus Și astfel încât elementul să ia următoarea formă:

Aici veți afla despre activitățile noastre, despre produsele software ale companiei noastre și despre echipamentele pe care le producem.

Utilizarea etichetelor puteți reduce dimensiunea fontului textului în comparație cu cea inițială.

O altă metodă de a specifica dimensiunea fontului este cu etichete. cu atributul dimensiune. Valorile acestui atribut sunt numere întregi de la 1 la 7. Valoarea 1 corespunde celei mai mici dimensiuni de font, iar valoarea 7 corespunde celei mai mari.

Folosind în loc de etichete vizualizați etichetele , vedeți cum se modifică dimensiunea fontului textului cu diferite valori ale atributului dimensiune - de la 1 la 7.

De asemenea, puteți utiliza numere de la 1 la 7 cu semnul + (plus) sau - (minus) ca valoare pentru atributul dimensiune. În acest caz, dimensiunea fontului crește sau scade în mod corespunzător, în comparație cu cea inițială, de exemplu, etichetele va crește dimensiunea fontului, comparativ cu cel actual, cu un nivel. Verifica.

Setați 5 ca valoare a atributului dimensiune pentru fragmentul de text în cauză: . Codul HTML pentru această piesă ar trebui să arate astfel:

Aici veți afla despre activitățile noastre, despre produsele software ale companiei noastre și despre echipamentele pe care le producem..

În etichete atributul color poate fi folosit și pentru a specifica culoarea fontului delimitată de etichete text. Valorile acestui atribut sunt aceleași ca și pentru atributele discutate anterior care descriu culoarea fundalului și a textului documentului.

În mod implicit, paragraful cu textul Aici veți ști... este aliniat la stânga. Centrați-l orizontal cu etichete

. De asemenea, puteți alinia un paragraf în partea dreaptă a paginii folosind etichete. sau în stânga - folosind etichete .

Lipiți etichete

limitându-le la paragraful desemnat.

Rețineți că am folosit etichete pentru a centra paragraful

, spre deosebire de atributul align="center", pe care l-am aplicat în etichete

.

Atenţie! Pentru etichetele 2010 ,

, , sunt considerate învechite și, prin urmare, este necesară utilizarea analogilor din stiluri. Asta nu înseamnă că nu le poți folosi, dar dacă poți, încearcă să scapi de ele.

=

=

=

=

=

Există, de asemenea, un număr mare de alte etichete învechite care nu pot fi descrise în acest articol, prin urmare este mai bine să vă familiarizați imediat cu site-urile WEB specializate pe această problemă. Dar pe cele principale le-am postat aici puțin mai sus

Codurile de selecție

Limbajul HTML permite două abordări ale selectării fontului fragmentelor de text. Pe de o parte, puteți indica direct faptul că fontul dintr-o anumită secțiune a textului poate fi aldin sau italic, cu alte cuvinte, este evident să indicați stilul fontului textului, așa cum am făcut în acest experiment. Pe de altă parte, este posibil să marcați orice bucată de text ca având un fel de stil logic, care este mai frumos decât de obicei, lăsând acel stil să fie interpretat de browser. În acest fel, stilul logic arată rolul piesei de text, de exemplu, marea sa importanță în comparație cu textul obișnuit, sau faptul că această piesă este un citat. În propria muncă, puteți utiliza etichete ulterioare care definesc stiluri logice. Vezi cum funcționează browsere diferite.

- folosit pentru a defini un cuvânt. Textul este afișat implicit cu caractere cursive.

- pentru a evidenția cuvintele și a amplifica. Textul este afișat implicit cu caractere cursive.

- pentru a evidenția titlurile cărților, filmelor, spectacolelor și așa mai departe, afișate implicit cu caractere cursive.

- pentru fragmente de cod de program. Afișat pe afișaj într-un font cu lățime fixă.

- folosit pentru textul pe care utilizatorul îl introduce de la tastatură. Poate fi afișat în diferite fonturi în diferite browsere. Etichetă depreciată.

- servește la afișarea mesajelor programului. Afișat într-un font cu lățime fixă. Etichetă depreciată.

- pentru fragmente deosebit de importante. De obicei evidențiate cu aldine.

- este folosit pentru a indica faptul că o bucată de text sau un cuvânt este o variabilă caracter, cu alte cuvinte, text care poate fi înlocuit cu diferite expresii. Afișat implicit cu caractere cursive. Etichetă depreciată.

Specificația HTML 4.0 oferă o metodă mai avansată de specificare a stilurilor pentru text și alte părți, folosind limbajul CSS Cascading Style Sheets. Foile de stil reprezintă o realizare uriașă în domeniul web design-ului, extinzând capacitatea de a îmbunătăți aspectul paginilor. Foile de stil facilitează definirea spațierii liniilor, a indentațiilor, a culorilor utilizate pentru text și fundaluri, a dimensiunii și stilului fontului și așa mai departe. Ca valoare a atributului de stil, sunt folosite perechi de forma „proprietate: valoare”. De exemplu, într-o bucată de cod care descrie un titlu de secțiune,

atributul style="color: blue" specifică faptul că proprietatea culorii este setată la albastru, adică textul antetului de la primul nivel ar trebui să fie afișat în albastru.

Alinierea stilului

Să vedem cum să folosiți limbajul pentru foile de stil în cascadă pentru a specifica stilul unei piese de text care începe cu cuvintele Aici veți învăța...

Pentru a specifica greutatea fontului, utilizați proprietatea font-weight cu valorile mai ușor (îngust), bold (bold), bolder (bold), de exemplu, style="font-weight: bold".

Pentru a defini stilul italic, utilizați proprietatea font-style cu valoarea italic. Prin urmare, pentru a face textul bold italic, ar trebui să găsiți atributul de stil astfel: style="font-weight: bold; font-style: italic". Vă rugăm să rețineți: caracteristicile pot fi plasate în orice ordine și trebuie separate prin punct și virgulă.

Dacă doriți să specificați dimensiunea fontului, atunci ar trebui să utilizați proprietatea font-size, ale cărei valori pot fi specificate în valori relative sau absolute. Valorile relative sunt procente, iar valorile absolute sunt puncte (pt), pixeli (px), centimetri (cm), milimetri (mm). De exemplu:

style="font-size: 200%"

style="font-size: 16pt"

style="font-size: 100px"

Prin specificarea dimensiunilor absolute, mai degrabă decât relative, privați utilizatorii care se uită la paginile dvs. de capacitatea de a mări sau micșora dimensiunea fontului folosind comanda meniului browserului în conformitate cu viziunea și rezoluția monitorului. Fonturile vor fi afișate numai în dimensiunea specificată de dvs. Prin urmare, este mai bine să specificați dimensiunea fontului ca procent. În acest caz, dimensiunea fontului va fi mai mică sau mai mare cu procentul indicat decât atunci când a fost proiectat Ajutor HTML etichetă implicită.

Pentru a determina metoda de aliniere orizontală pentru text, utilizați proprietatea text-align cu valorile stânga (la stânga), dreapta (la dreapta), centru (în centru), justificare (în lățime). În acest fel, pentru a indica faptul că textul Aici veți învăța... ar trebui să fie formatat cu caractere aldine italice cu o dimensiune de 150% din inițial și aliniat la centru, stilul său ar trebui găsit după cum urmează:

style="font-weight: bold; font-style: italic; font-size: 150%; text-align: center"

Vom aplica acest atribut în etichete<р>, care vă permit să prezentați textul ca un paragraf separat.

Editați elementul HTML pentru a include text Aici veți afla... prin eliminarea etichetelor

, , , și inserarea etichetelor<р>Șicu atributul style, astfel încât acest element să ia următoarea formă:

<р style="font-weight: bold; font-style: italic; font-size: 150%; text-align: center">Aici veți afla despre activitățile noastre, despre produsele software ale companiei noastre și despre echipamentele pe care le producem.

Vedeți, limbajul HTML vă permite să utilizați diverse metode design de stil. În același timp, utilizarea limbajului tabelelor în cascadă stiluri css este mai de dorit.

Alte opțiuni de aliniere și stil

Am văzut o singură utilizare a limbajului foii de stil, în care definiția stilului este plasată în mod specific în eticheta elementului pe care îl descrieți.

Acest lucru se face folosind atributul style, care este folosit cu majoritatea etichetelor HTML standard. Dar există și alte utilizări pentru CSS.

În HTML standard, fără introducerea foilor de stil, pentru a atribui anumiți parametri oricărui element, cum ar fi culoarea, dimensiunea, poziția pe pagină și altele asemenea, trebuie să conturați aceste caracteristici pentru fiecare element de fiecare dată, chiar dacă 10 pagini sunt obligate să fie plasate pe o singură pagină.ki astfel de părți care nu diferă unele de altele. Trebuie să inserați aceeași bucată de cod HTML în pagină de 10 ori, mărind dimensiunea fișierului și timpul de descărcare din rețea.

Foile de stil funcționează într-un mod diferit, mai confortabil și mai economic. Pentru a atribui anumite caracteristici oricărui element, trebuie mai întâi să conturați acest element și să găsiți această descriere ca stil, iar în viitor, să indicați pur și simplu că elementul pe care doriți să-l stilizați corespunzător ar trebui să capete caracteristicile stilului pe care l-ați descris. . Confortabil, nu-i așa?

Mai mult, puteți salva descrierea stilului nu în textul paginii dvs. WEB, ci în dosar separat- acest lucru vă va permite să utilizați descrierea stilului pe orice număr de pagini WEB. Și un alt avantaj asociat este capacitatea de a schimba designul oricărui număr de pagini, corectând doar descrierea stilului într-un fișier separat.

În plus, limbajul pentru foile de stil vă permite să lucrați cu designul fontului paginilor la un nivel chiar mai ridicat decât HTML standard.

ÎN ora curentă Limbajul CSS are un număr destul de mare de opțiuni pentru părțile HTML pe care le poate controla. Prin utilizarea „sigur”, cu alte cuvinte compatibil cu cel mai mare număr browsere elemente css- caracteristicile fontului, culorile părților și fundalului, caracteristicile textului și a chenarelor - vă puteți facilita foarte mult munca și vă puteți face paginile WEB mai atractive în ceea ce privește designul textului.

Salutare dragi cititori ai blogului! Acest articol va vorbi despre etichete de formatare a textului. Exemple proeminente fac textul îngroșat sau cursiv. Vom avea în vedere și influența unor etichete asupra optimizării interne a site-ului și a regulilor de scriere a acestora. Puteți citi despre asta în articolul de mai jos. Apropo, puteți găsi elemente de design text similare în multe editoare de text, de exemplu, în Word.

Etichetele sunt împărțite în 2 tipuri: bloc și inline. Când utilizați primul, puteți modifica conținutul unei părți a textului (linii, fragmente individuale sau cuvinte), iar cele din urmă sunt . Etichetele de formatare pe care le vom acoperi în acest articol sunt predominant inline.

Reguli și ordinea scrierii etichetelor

Știți deja ce sunt etichetele de deschidere și de închidere. Dacă nu, atunci citiți articolul de la începutul acestui material. Pe scurt, există două tipuri de etichete: single (de exemplu, transfer to linie nouă
) și container (pereche). Deci, toate etichetele de formatare a textului sunt pereche. Aceasta înseamnă că orice element are o etichetă de deschidere și de închidere, iar evidențierea trebuie plasată între ele. De exemplu, selectarea corectă a unei fraze ar arăta astfel: Selecţie

Când browserul procesează acest fragment, veți vedea următorul text: Fragment selectat. Apropo, în Flux RSS toate etichetele nu sunt afișate ().

Principalul lucru atunci când scrieți etichete este să nu uitați să le închideți. În caz contrar, tot textul de pe pagină va fi aldine (în exemplul cu eticheta ). Dar există cazuri când trebuie să selectați un anumit fragment atât cu caractere aldine, cât și cu caractere cursive în același timp. Dar nu există nicio etichetă care să efectueze această acțiune. Există o singură cale de ieșire din această situație: folosiți două etichete în același timp. Nu contează în ce ordine le folosiți. Prin urmare, scrieți textul cu etichete ca aceasta:

Selecţie

sau cam asa:

Selecţie

Încă mai primești Selecţie cursiv și îndrăzneț în același timp. Cu toate acestea, este de preferat să folosiți prima variantă, deoarece inițial a fost singura și corectă. De asemenea, nu uitați că fiecare browser poate procesa etichetele în mod diferit (), în funcție de setări. Acum să trecem la etichetele de formatare în sine.

Crearea textului îngroșat și italic - etichete , , Și

Cele mai populare etichete de formatare a textului - evidențierea acestuia îndrăzneţȘi cu caractere inclinate. De obicei sunt folosite pentru a da importanță oricărui fragment. Primul caz servește la selectarea unui fragment care conține Informatii utile sau cuvinte cheie. Cursivele servesc aceluiași scop ca și textul aldin, dar informațiile sunt mai puțin importante, deoarece caracterele cursive sunt mai puțin vizibile pe fundalul corpului textului decât textul aldin.

Sa incepem cu făcând textul aldine. Există două etichete utilizate pentru această acțiune − Și . Diferențele în aspect Nu. Deși, având în vedere că fiecare browser poate interpreta diferit fiecare element, ar trebui să puteți vedea unele diferențe. Așa arată textul din etichete Și în forma deja procesată de browser:

Text în etichete puternice

Text în etichete b

Și iată cum arată aceste două rânduri în codul sursă al paginii:

Text în etichete puternice Text în etichete b

Aceeași situație o putem observa și în cazul etichete italice Și . Încercați să găsiți diferențele dintre cele două exemple:

Text în etichetele em

Text în etichetele I

Si aici sursă:

Text în etichetele em Text în etichetele I

Deci, etichetele de selecție considerate îngroșate și cursive nu diferă de fapt, dar de ce atunci avem nevoie, de exemplu, de eticheta în cazul în care există ? La urma urmei, acesta din urmă conține un singur caracter (fără a număra paranteze) și, prin urmare, este mai ușor de scris. Și chestia este că etichetează Și a afecta . Dacă înconjurați cuvintele cheie cu aceste etichete, acest lucru va avea un efect pozitiv asupra promovării site-ului. Principalul lucru este să nu exagerați - textul maxim ar trebui să fie de 5% text îngroșatîn etichetă , și aceeași cantitate de italice în etichetă .

Dacă doriți doar să evidențiați un punct din text, atunci utilizați eticheta sau . În general, cred că motoarele de căutare consideră și textul din aceste etichete ca fiind mai important, dar pe optimizare internă au tot mai puțin efect decât Și .

Evidențiați etichetele slash de text − , Și

Acum să ne uităm la câteva etichete care folosesc o lovitură în decorarea textului. Cel mai faimos pentru tine editori de text — etichetă sau subliniere. Această etichetă nu afectează clasamentul (din câte știu eu), dar va ajuta la evidențierea unui text și la concentrarea asupra acestuia. Am dat un exemplu de utilizare a acestei etichete puțin mai sus.

Încă două etichete similare - Și . Ambele îndeplinesc funcția de text barat. Puteți utiliza această etichetă în orice situație: dacă actualizați un document (sau mai degrabă o parte din acesta), îl puteți tăia pe cel vechi și adăugați unul nou; dacă aveți de gând să scrieți ceva care se abate de la subiectul materialului; ceva care nu corespunde standardelor morale și etice.

Diferențele dintre aceste două etichete sunt doar în lor scris, drept urmare este de preferat să se folosească primul, deoarece în primul rând, este mai convenabil să scrii și, în al doilea rând, va fi mai puțin cod HTML pe pagina ta, iar motoarele de căutare le place.

Etichetă și atribute - setările fontului textului

Acum luați în considerare o etichetă care nu este folosită fără atribute. Cu acesta, puteți seta parametrii pentru o anumită bucată de text. În general, acum este de preferat să se utilizeze (foile de stil în cascadă), deoarece folosindu-le, puteți reduce foarte mult întregul cod HTML al paginii. Deci, luați în considerare aceeași etichetă . Pentru el există de toate trei atribute:

  • față- fontul în sine. De exemplu, Arial, Courier sau Verdana. Puteți enumera câteva, pentru că. nu toți utilizatorii au un set extins de fonturi, iar prin scrierea mai multor în atributul face, browserul va putea alege pe care să îl folosească sau, mai degrabă, care este prezent în sistem;
  • mărimea este un atribut care specifică dimensiunea textului. Poate fi exprimat atât în ​​unități arbitrare, cât și în pixeli;
  • culoare- culoarea textului. Acest atribut poate fi folosit atât în ​​codurile de culoare HTML, cât și în cele verbale. Primele arată ca #FFFFFF (unde F este orice număr sau literă de la A la F), în timp ce cele din urmă sunt scrise în cuvinte simple(de exemplu, roșu - roșu).

Așa arată textul din etichetă folosind fiecare atribut:

Acest text are 6 pixeli 


Acest text este roșu


Acest text este în font Arial


Acest text este roșu și are dimensiunea de 5 pixeli.

Și iată ce veți vedea după procesarea codului scris: 


Elemente de proiectare a textului bloc - Titluri 
-
, paragraful 


În cele din urmă, ne vom uita la elementele bloc, care sunt utilizate în aproape fiecare document.  Acestea sunt etichete de titlu și paragraf.  Să luăm în considerare primul.  Titlurile vin în 6 tipuri și fiecare are propria etichetă.  Fiecare specie are doar propriul număr de serie și este înregistrată folosind etichete. 
, 
,..., 
.  Iată cum arată toate anteturile atunci când sunt procesate:




Numărul de după cuvântul din titlu corespunde numărului din etichetă .  Titlurile au un impact uriaș asupra optimizării paginii, așa că includeți-le în etichete Cuvinte cheie.  Există destul de multe caracteristici ale acestui caz, pe care le voi discuta în articolele următoare.


Acum să vorbim despre eticheta de selecție a paragrafului 
Funcția acestei etichete este de a separa textul de alt text similar cu o linie goală.  Dacă te uiți la codul sursă al oricărui document, poți vedea următoarele:




Dreptunghiurile verzi conțin un paragraf, dreptunghiurile roșii altul.  Și iată cum arată acest cod după procesarea de către browser (săgeata indică o linie goală):




Drept urmare, obținem o separare destul de vizibilă a unui paragraf de altul, ceea ce este benefic - citirea devine mai convenabilă.


Acesta este sfârșitul articolului despre etichete de formatare a documentelor.  Sunt mult mai multe decât am descris în acest articol.  Doar că unora trebuie să li se spună destul de multe, drept urmare articole separate cu o recenzie completă le vor fi dedicate.!


Fontul italic este una dintre cele mai populare moduri de a evidenția o bucată de text și de a-i da o anumită semnificație.  Este ideal pentru citate, note de subsol, titluri și nume proprii.  Există două etichete speciale în HTML pentru afișarea cursivelor.  În CSS, italic este controlat de proprietatea font-style.
 
Font italic sau italic?
 
Afișarea aceluiași font cu caractere cursive poate varia.
Imaginea arată trei blocuri de text în același font Playfair Display.  Prima este în stil roman normal, în timp ce a doua și a treia sunt italice.  Sunt deschise în același browser Google Chrome dar arată complet diferit.
 
Faptul este că unele fonturi au propriile seturi de caractere italice.  Dacă browserul nu are acces la acest set, dar întâlnește text care ar trebui să fie afișat ca cursiv, va încerca să îl încline singur.
În al doilea bloc - doar o astfel de versiune procesată de browser, iar în al treilea - versiunea originală italica a fontului Playfair Display, care are un stil unic, mai mult ca unul scris de mână.  Browserul, pe de altă parte, înclină pur și simplu fiecare caracter al textului într-un anumit unghi, imitând caracterele cursive.
Când vă dați seama cum să faceți italice în CSS sau HTML, este important să rețineți că, în cazul anumitor fonturi, trebuie să vă asigurați că browserul are acces la seturile de italice ale acestora.  În unele cazuri, rezultatul algoritmilor de înclinare a browserului poate fi nesatisfăcător.
 
HTML cursiv
 
Există două etichete speciale pentru textul italic în HTML: i (de la cuvântul italic) și em.  Stilul unui fragment de text inclus în oricare dintre acești descriptori va fi același.
Diferența constă în alocarea logică.  Eticheta em indică semnificația specială a fragmentului.  Acest lucru este important pentru roboții de căutare și cititoarele de ecran, care vor evidenția textul specificat folosind intonația.
 
proprietate de stil font
 
În CSS, cursul este controlat de instrucțiunea stil font.  Poate lua una dintre cele trei valori de bază:
 
  • normal - font normal;
    •  
  • italic - stil italic;
    •  
  • oblic - stil oblic.
    • 

Pe în prezent majoritatea browserelor moderne tratează oblic și italic în același mod, dar inițial se credea că primul este rezultatul algoritmilor specifici browserului care înclină fiecare caracter spre dreapta.
Dacă fontul pe care îl căutați nu este găsit de browser, atunci italic va arăta exact la fel ca oblic.
Spre deosebire de eticheta em, nu acordă fragmentului evidențiat o importanță deosebită, ci mai degrabă corespunde descriptorului i.
 
Exemple
 
Citatele sunt adesea evidențiate cu caractere cursive.  Să încercăm să-l facem să arate frumos.
Citat (stil font: italic; chenar-stânga: 5px violet continuu; umplutură-stânga: 20px; )
Pe lângă chenarul decorativ din dreapta și căptușeală, blocul de citate are o regulă de tip font cu valoare italic.
 
 
Setează CSS italic.


În html, dimensiunea fontului joacă un rol important.  Atrage atenția utilizatorului asupra Informații importante postat pe pagina site-ului.  Deși nu numai dimensiunea literelor este importantă, ci și culoarea, grosimea și chiar familia lor.

 
Etichete și atribute atunci când lucrați cu fonturi html


Limbajul hipertext are un set mare de instrumente pentru lucrul cu fonturile.  La urma urmei, formatarea textului este sarcina principală a html.


Cauza creației limbaj HTML a existat o problemă de afișare a regulilor de formatare a textului de către browsere.



Luați în considerare etichetele care sunt folosite pentru a lucra cu fonturile în html și atributele acestora.  Principala este eticheta .  Folosind valorile atributelor sale, puteți seta mai multe caracteristici ale fontului:


  • culoare - setează culoarea textului;
    • 

  • dimensiune – dimensiunea fontului în unități arbitrare.
    • 

Este acceptată o valoare de atribut pozitivă de la 1 la 7.


  • fata - folosit pentru a seta familia de fonturi a textului care va fi folosit in interiorul etichetei .  Sunt acceptate valori multiple, separate prin virgule.
    • 


Doar textul care se află între părțile etichetei de font pereche este formatat. Restul textului este afișat în fontul implicit.


De asemenea, în html există o serie de etichete pereche care definesc o singură regulă de formatare.  Acestea includ:


  • - se setează în html font aldine.  Etichetă similar în acțiune cu cel precedent;
    • 

  • - dimensiunea este mai mare decât cea implicită;
    • 

  •  — dimensiune mai mică font;
    • 

  • - text italic (italic).  Etichetă similară ;
    • 

  • — text cu subliniere;
    • 

  • - tăiat;
    • 

  • - afișați textul numai în literă mică;
    • 

  • - cu litere mari.
    • 

text simplu


Miniatură


Miniatură


Mai mult decât de obicei


Mai puțin decât de obicei


Cursive


Cursive


Cu subliniere


Striat


Capabilități de atribute de stil


Pe lângă etichetele descrise, există mai multe moduri de a schimba fontul în html .  Una dintre ele este utilizarea atributului stil generic.  Folosind valorile proprietăților sale, puteți seta stilul de afișare a fontului:


1) font-family - proprietatea setează familia de fonturi.  Este posibilă enumerarea mai multor valori. 
Schimbarea fontului în html la următoarea valoare se va întâmpla dacă familia anterioară nu este setată la sistem de operare utilizator.


Sintaxa de scriere:


familia-font: font-name [, font-name[, ...]]


2) font-size - dimensiunea este setată de la 1 la 7. Acesta este unul dintre principalele modalități prin care puteți crește fontul în html. 
Sintaxa de scriere:


font-size: dimensiune absolută |  dimensiune relativă |  valoare |  interes |  moşteni


De asemenea, puteți seta dimensiunea fontului:


  • În pixeli;
    • 

  • În termeni absoluti ( xx-mic, x-mic, mic, mediu, mare);
    • 

  • În procente;
    • 

  • În puncte (pt).
    • 

dimensiunea fontului: 7


dimensiunea fontului: 24px


Dimensiunea fontului: x-mare


dimensiunea fontului: 200%


dimensiunea fontului: 24 pt


3) font-style - setează stilul fontului.  Sintaxă:


stil font: normal |  cursiv |  oblic |  moşteni


Valori:


  • normal - ortografie normală;
    • 

  • italic - italic
    • 

  • oblic - font cu o înclinare spre dreapta;
    • 

  • inherit - moștenește ortografia elementului părinte.
    • 

Un exemplu despre cum să schimbați fontul în html folosind această proprietate:


font-style:moștenire


stil font: cursiv


stil font: normal


stil font: oblic


4) font-variant - convertește toate literele mari în majuscule.  Sintaxă:


font-variant: normal |  majuscule mici |  moşteni


Un exemplu despre cum să schimbați fontul în html cu această proprietate:


font-variant:moștenire


font-variant:normal


font-variant:small-caps


5) font-weight - vă permite să setați grosimea scrierii textului (saturație).  Sintaxă:


greutate font: bold|bolder|lighter|normal|100|200|300|400|500|600|700|800|900


Valori:


  • bold - setează fontul html la bold;
    • 

  • îndrăzneț - mai îndrăzneț față de normal;
    • 

  • mai ușoară - mai puțin saturată față de normal;
    • 

  • normal - ortografie normală;
    • 

  • 100-900 - setează grosimea fontului în termeni numerici.
    • 

greutate font: bold


greutatea fontului: mai îndrăzneață


greutate font: mai ușor


greutate font: normal


greutate font: 900


greutate font: 100


proprietatea fontului și culoarea fontului html


Fontul este o altă proprietate a containerului.  Pe plan intern, a combinat valorile mai multor proprietăți concepute pentru a schimba fonturile.  Sintaxa fontului:


font: font-size font-family |  moşteni


De asemenea, valoarea poate fi setată la fonturile folosite de sistem în inscripțiile de pe diverse elemente controale:


  • legenda - pentru butoane;
    • 

  • pictogramă - pentru icoane;
    • 

  • meniu - meniu;
    • 

  • mesaj-box - pentru casete de dialog;
    • 

  • small-caption - pentru controale mici;
    • 

  • status-bar - font bara de stare.
    • 

font:pictogramă


font:legendă


font:meniu


font: caseta de mesaje


legendă mică


font:bara de stare


font: italic 50px bold „Times New Roman”, Times, serif


Pentru a seta culoarea fontului în html, puteți folosi proprietatea color.  Vă permite să setați culoarea, ca și cu cuvânt cheie, și în format rgb.  Și, de asemenea, sub forma unui cod hexazecimal.


În articolul curent, vom vorbi despre cum să evidențiați textul. cu caractere inclinate HTML.  Ca și în cazul textului aldin, textul italic poate fi făcut în trei moduri:


  • Etichetă i HTML;
    • 

  • Etichetă ei HTML;
    • 

  • proprietate CSS stilul fontului.
    • 

Să luăm în considerare toate cele trei opțiuni despre cum să faceți cursive în HTML, să discutăm subtilitățile acestei probleme și care sunt metodele mai convenabile și mai corecte de utilizat în anumite situații.


Text italic: etichetă 


Etichetă i(italic), prin analogie cu eticheta b pentru textul aldin, subliniază fizic textul italic (înseamnă că doar stilul textului se schimbă).  Aplicație de etichetă i:

 Creator de site-uri web „Nubex”

Astfel, partea dorită a textului este plasată între etichete 
.


Text italic: etichetă 


Deși eticheta i rămâne valabil, din punct de vedere al optimizării site-ului, este mai bine să folosiți eticheta ei pentru a evidenția secțiuni importante din punct de vedere logic din text.  Aceasta înseamnă că roboții de căutare țin cont de importanța textului plasat între etichete. 
:
Creator de site-uri web "Nubex"

Rezultat:


Creator de site-uri web "Nubex"


Dar nu uitați că textul este inclus în etichete iȘi ei, deși sunt afișate aproape la fel (în total browsere moderne), în mod inerent nu sunt chiar identice, așa cum s-a menționat mai sus.  Prin urmare, trebuie să utilizați etichete după cum este necesar: etichetă eiÎncadrați HTML secțiuni importante de text și aplicați stilul vizual italic folosind o etichetă i sau stiluri CSS.  Să ne uităm acum la utilizarea stilurilor CSS pentru a italiciza textul.


Text italic cu CSS


Pentru a seta stiluri de afișare a fonturilor în CSS, utilizați proprietatea stilul fontului, care poate lua valorile: oblic(text italic), cursiv(italice) și normal(font obișnuit).


Merită să ne amintim că cursiv font și înclinat sunt, în esență, nu la fel. Cursive este un font special care este analog cu scris de mână, A înclinat format prin înclinarea fontului obișnuit spre dreapta.


Aplicarea unui atribut stilul fontului la practica:

 

 
 
 Italică cu <a href="https://olympsb.ru/ro/teg-ol-v-html-oznachaet-kak-razmestit-elementy-spiska-gorizontalno-izmenenie-markerov-tega-s-pomo.html">folosind CSS</a>- „Nubex”
 
 
 
 

 
Site-urile noastre sunt cu adevărat pas imensîn dezvoltarea web.

 
O facem pe bune calitate site-uri.

 

 






Dar trebuie să rețineți că unele browsere text cu proprietatea font-style: oblic; nu poate fi interpretat ca text italic, ci ca italic.