Există două tipuri de etichete. Prima include pe cele pereche, care includ două componente, de unde și-au luat numele. Aceste componente se numesc etichete de deschidere și de închidere. O etichetă de închidere se distinge de omologul său prin prezența unui simbol / , care se pune imediat după < .

Al doilea tip de etichete sunt etichete simple. Și, după cum sugerează și numele, nu sunt asociate cu o a doua etichetă de închidere.

Etichete HTML unice

Când creați o pagină folosind HTML, scopul principal al unei etichete asociate este de a marca începutul și sfârșitul unei anumite fragment de text. Cu toate acestea, sunt folosite și etichete a căror sarcină nu are nicio legătură cu evidențierea fragmentelor de text.

Exemple de astfel de etichete includ cele care vă permit să setați o linie de separare sau să adăugați o imagine în pagină. Și tocmai aceste etichete sunt singure, deoarece, ca să spunem așa, își îndeplinesc funcția fără o pereche.

Aceste etichete includ:
,

Linia
Rândul următor

Dacă vedeți undeva ca acest format pentru înregistrarea unei singure etichete
, atunci să știți că așa au fost expuse în mai multe versiuni anterioare HTML. Dar acum că a apărut HTML 5, bara oblică nu este necesară.

Atributele etichetelor HTML

Tot în conversație despre Bazele HTML Este imposibil să nu menționăm atributele etichetei. Pentru anumite etichete, utilizarea atributelor nu este obligatorie, dar este perfect acceptabilă. Și, în unele cazuri, sunt cu siguranță necesare.

Un exemplu de astfel de caz ar putea fi eticheta , care este conceput pentru a insera o imagine pe o pagină. Atribut obligatoriu pentru această etichetă este src, cu care puteți indica unde exact se află poza. Acest lucru se face astfel încât browserul să poată deschide imaginea. Dacă adresa imaginii este specificată fără un atribut, imaginea nu va fi afișată pe pagină.

De regulă, în majoritatea cazurilor etichetele și atributele sunt scrise în HTML astfel:

<имя-тега атрибут1="значение1" атрибут2="значение2" …>

O etichetă poate avea unul sau mai multe atribute. Mai jos puteți vedea exemple.

......

Deci, sper că totul este simplu și clar aici. Dar dacă se întâmplă ceva, nu ezitați să întrebați - cu siguranță voi ajuta. În lecțiile următoare, vom descompune diferitele etichete și vom afla ce face fiecare.

Ați citit deja că toată limba este alcătuită din etichete. În această lecție vom arunca o privire mai atentă asupra etichetelor HTML. În limbajul HTML, etichetele sunt împărțite în etichete simple (nepereche) și etichete asociate. Deci, etichetele HTML unice constau dintr-o singură etichetă, adică nu au o etichetă de închidere. Iar descriptorii perechi au o etichetă de deschidere și de închidere.

Etichete HTML unice

Etichete unice nu au o etichetă de închidere. De exemplu:
, . Anterior ei scriau așa:
, , acum acest stil de a scrie etichete individuale nu este relevant, așa că nu scrie așa. Cel mai utilizat etichete unice:
- transfer către linie nouă,

Etichete HTML asociate

Etichete pereche mult mai mult. Un descriptor asociat are o etichetă de deschidere și de închidere. Eticheta asociată formează un container. Conținutul containerului este ceea ce se află între etichetele de deschidere și de închidere. În exemplul din acest articol ați văzut eticheta

Ce sunt descriptorii în HTML?

, iar la final

Principala gresealaîncepători care scriu etichete pereche, aceasta este o confuzie în cuibărire. De exemplu, aceasta este intrarea corectă:

Paragraf îndrăzneț

Paragraf îndrăzneț

Cum să scrieți corect etichetele asociate

Ce este nou în HTML5 în ceea ce privește etichetele?

limbaj HTML5 este o extensie a HTML4, deci păstrează majoritatea sau toți descriptorii din HTML4 și își adaugă proprii. În HTML5 a apărut etichete speciale pentru a împărți site-ul în blocuri principale: antet, meniu, subsol, bară laterală și conținut.

De ce este important să înveți cum să folosești etichetele?

Motoarele de căutare Yandex și Google sunt sensibile Aspect HTML documente, verificând valabilitatea acestora. Ei caută cuvinte cheie incluse în descriptori speciali și așa mai departe. Dar această secțiune nu este despre asta. Acest lucru se aplică promovării (SEO).

Cum să înveți toate etichetele HTML?

Da, există destul de multe etichete. Dar nu este nevoie să-i învățați în mod special. Atâta timp cât exersați să scrieți ceva, toți descriptorii, perechi și singuri, vor fi rememorați cu ușurință. Cu timpul, desigur.

Bună ziua, dragi cititori ai blogului! În ultimul articol, ne-am dat seama ce este un tip de document și cum determină browserele limba folosită folosind . Eticheta a fost luată în considerare, dar conceptul (termenul) în sine nu a fost. În acest articol vă voi spune ce este o etichetă, de ce este necesară și ce tipuri de etichete există. După cum am spus în ultimul articol din această secțiune, vom crea o pagină de fișier, pe care o vom experimenta, pe baza cunoștințelor pe care le-am dobândit. Dar acesta este la sfârșitul articolului, dar deocamdată să ne uităm la eticheta HTML.

Ce este o etichetă HTML, tipuri de etichete HTML, exemple de scriere

Aceasta este o etichetă de evidențiere a textului cu aldine. Etichetele au trei tipuri:

• Eticheta de deschidere- etichetă la început. În exemplul de mai sus, eticheta se deschide și stă în fața textului care trebuie evidențiat.
• Etichetă de închidere- etichetă la sfârșit. Trăsătură distinctivă servește ca o bară oblică „/” înaintea caracterelor din paranteze unghiulare. Să ne uităm din nou la exemplul discutat mai sus. Etichetă se închide și vine după text, care trebuie evidențiat cu caractere aldine
• Etichete unice- etichete care nu au o etichetă de închidere. Un exemplu ar fi
  Iată un exemplu de etichetă de deschidere și de închidere:

Întregul design, inclusiv textul, va arăta astfel:

Acest text va fi evidențiat cu caractere aldine

Și așa va arăta acest text atunci când browserul îl prelucrează și ni-l oferă: Acest text va fi evidențiat cu caractere aldine. Există, de asemenea, un astfel de concept ca etichete de containere, dar acesta este doar un nume generic pentru etichetele de deschidere și de închidere. După cum am scris mai sus, pe lângă etichetele containerului, există și etichete unice. Diferența este că astfel de etichete nu trebuie să fie închise. Cea mai strălucitoare și cea mai mare exemplu frecvent servește ca etichetă newline.

Practic, etichetele simple sunt folosite pentru a insera un element, cum ar fi o imagine sau un tabel.

Ce sunt atributele, regulile de scriere și de ce sunt necesare?

, care, fără atribute, de fapt nu face nimic semnificativ.

Font— o etichetă de container utilizată pentru formatarea textului. Folosind această etichetă, puteți face textul îngroșat, puteți modifica dimensiunea și distanța dintre linii - în general, tot ce puteți face cu textul. Să ne uităm la un exemplu cu dimensiunea textului. Mai întâi, să includem textul într-o etichetă Font.

Text

Acum puțin despre regulile de scriere a atributelor. Atribute Mereu sunt scrise în eticheta de deschidere și după caracterele etichetei în sine. Puteți scrie mai multe atribute într-o singură etichetă, în orice ordine. Atributele le găsiți pe site-ul validatorului W3C (despre care voi scrie mai jos). Deci, iată un exemplu de etichetă de font cu un atribut de dimensiune:

Text

Acest atribut din eticheta fontului modifică dimensiunea textului inclus în etichete.
Dacă deschizi sursă pagina, veti vedea ca locul unde se afla cuvânt mare„Text” arată ca

Text

Ați văzut deja cum sunt scrise atributele. Sunt scrise exact în același mod în alte etichete: mai întâi scriem atributul în sine (în în acest caz, dimensiune), apoi puneți „=” și includeți parametrul de atribut ghilimele duble. Puteți găsi toți parametrii de atribut pe același site web al consorțiului world wide web.

Ce este un validator W3C, reguli de scriere și lista de etichete

După cum am scris, există foarte multe etichete. Dar unde le poți găsi pe toate? Pentru asta există validator W3C W3C - Lume Wide Web Consorţiu, iar în rusă - World Wide Web Consortium. Nu este complet clar, nu? Acesta este locul în care sunt dezvoltate standardele web - (limbajele de marcare hipertext sunt creația lor). În fruntea întregului consorțiu se află Tim Berners-Lee, cunoscut din articolul precedent, creatorul HTML-ului. Site-ul web al acestei organizații este w3.org. Vă avertizez, site-ul este în întregime în engleză, așa că aveți un dicționar sau un traducător în browser. Apropo, ratingul Google pentru acest site este 9 și 37.000 (asta este mult, dacă cineva nu știe).

Să revenim la subiectul articolului. Suntem interesați de standardele lingvistice HNTML 4.01. Urmați linkul HTML 4.01 Specification, după care vedem fila elemente în partea de sus, faceți clic pe ea. Aici se deschide pagina cu toate etichetele. Aceste etichete au fost dezvoltate și adoptate ca standard de către consorțiu. Totul, din nou, este în engleză. Imediat după cuvintele „Indexul elementelor” vedem o legendă (sensul literelor din coloane):

Și imediat după legendă există un tabel cu etichetele în sine:

• În prima coloană - Nume— numele etichetei în sine este ceea ce ar trebui să fie între paranteze unghiulare (< и >).
• A doua coloană - Eticheta de pornire- prezenta unei etichete de deschidere. ÎN această coloană puteți vedea litera „O”, care înseamnă „Opțional”, iar în traducere din engleză - Opțional. Această literă este prezentă doar în fața etichetelor , , Și și înseamnă că puteți pune o etichetă de deschidere sau nu trebuie - browserul va face totul singur.
• A treia coloană - Etichetă de final— prezența unei etichete de închidere. Vizavi de această etichetă puteți vedea atât litera „O”, cât și litera „F”. Sensul primului nu s-a schimbat. A doua literă - „F” - literalmente „interzis” în engleză - înseamnă că este interzis să puneți o etichetă de închidere, pur și simplu nu există. De exemplu, nu există nicio etichetă, pentru că nu există nimic de ascuns în ea.
• Al patrulea - Gol— înseamnă că eticheta este singură (golă). Toate etichetele care au litera „E” în ​​fața lor în această coloană au și litera „F” în coloana anterioară. La urma urmei, etichetele simple nu au etichete de închidere. Un exemplu este aceeași etichetă .
• A cincea coloană - Depr. sau Depreciat- din engleză „not recommended”. Dacă această coloană conține litera „D” (care înseamnă exact aceeași), înseamnă că această etichetă nu este recomandat pentru utilizare în HTML. Privind puțin înainte, astăzi pentru designul atât a textului, cât și aspectÎntregul site și documentul HTML utilizează foi de stil în cascadă (CSS). Pe scurt și simplu, se creează un singur fișier în care sunt scriși toți parametrii de text care pot fi apelați de anumite atribute de etichetă. Asa de, această funcție folosit doar pe site-uri web, deoarece CSS nu este aplicabil atunci când trimiteți știri prin e-mail sau RSS. Și aici aceleași etichete vin în ajutor. Majoritatea acestor etichete, apropo, se referă la designul textului ( Și sunt un exemplu)
• A șasea coloană - DTD- poate conține fie o scrisoare "L", sau "F". În primul rând - "L" - DTD liber— înseamnă că eticheta opusă care este scrisoarea dată, poate fi utilizat numai într-un tip de document tranzitoriu (- Tranzițional, despre care am scris în articolul precedent). Al doilea - "F" — DTD cadru— înseamnă că eticheta poate fi utilizată numai într-un document, tastați FRAMESET (- Setul de cadru). Dacă scrisoarea lipsește, atunci eticheta poate fi folosită în toate tipurile de documente.
• Și ultima, a șaptea coloană - Descriere — scurta descriere tag, din nou în engleză

Atributele sunt conținute în aceeași pagină a specificației HTML 4.01, dar în fila „atribute”. Există mult mai multe atribute decât etichete. Și din nou voi scrie totul punct cu punct.

• Prima coloană - Nume— ca și în cazul etichetelor — numele atributului. Totul este în engleză, dar având cunostinte de baza poți ghici ce face cutare sau cutare atribut.
• A doua coloană - Elemente înrudite este o listă a tuturor etichetelor care folosesc orice atribut. Toate etichetele au linkuri, astfel încât să puteți accesa imediat informații despre etichetă.
• A treia coloană - Tip- asta este tot valori posibile un anumit atribut. De exemplu, vizavi de cel pe care l-am selectat atribut dimensiune V Eticheta fontului valoarea este CDATA. Ne vom uita mai târziu, dar pe scurt, este un set special de opțiuni de dimensiune (în acest caz). La urma urmei, puteți scrie atât pixeli, cât și procente
• A patra coloană - Mod implicit- indică dacă atributul este necesar într-o anumită etichetă. De exemplu, în tag Img atributul src este necesar, deoarece indică sursa din care să preia imaginea.
• Coloanele 6, 7 și 8 înseamnă același lucru ca și în cazul etichetelor.

Toate cele de mai sus se aplică numai pentru versiuni HTML 4.01. Despre HTML 5 vom vorbi într-un alt articol și vom atinge și XHTML. Și acum, așa cum am promis, vom crea o pagină în HTML, pe care o vom experimenta.

Crearea unui fișier în format html - document HTML

În primul rând, să ne dăm seama despre ce este vorba document HTML. Și acesta este, de fapt, un fișier în format HTML. Și toate paginile de internet sunt documente HTML. De exemplu, când ajungeți la un site în bara de adresa la sfârșit puteți vedea „.html” sau „.htm” după adresă. Acesta este fișierul pe care îl vom crea cu această extensie. În general, dacă doriți să experimentați mai degrabă cu un site web decât cu o pagină, atunci este mai bine să creați server local— Denver (despre care vreau să scriu totul).

Având în vedere că nici măcar nu am vorbit despre etichetele prezente pe fiecare pagină, pur și simplu vom crea un fișier cu orice nume și extensie.html. Este posibil (și cel mai bine) de utilizat Notepad++, pentru că în aceasta editor de text Se folosește evidențierea codului, ceea ce este foarte convenabil la editarea codului, iar fișierele pot fi salvate într-o varietate de formate. Există și programe în care, atunci când tastați un cod, rezultatul apare imediat în formă procesată.

Deci trebuie doar să deschidem Notepad++și salvați fișierul cu text liber(poate fi gol), dar în format .html. Pentru a face acest lucru, ca de obicei, faceți clic pe inscripția fișierului, apoi „salvați ca” și căutați printre lista mare extensii „Fișier HyperText Markup Language(extensii de fișiere)". Asta e tot, de fapt. Vom adăuga primele rânduri la acest fișier în următorul articol din secțiunea „Crearea unui site web de la zero”

Etichetă (pl. etichete, uneori etichetă) este un element limbaj HTML, cu care se realizează marcarea text sursă pagini web. Etichetele sunt abrevieri sau abrevieri ale cuvintelor engleze incluse între paranteze unghiulare<>, de exemplu, etichetați

…

abreviere pentru cuvânt englezesc paragraf, adică textul inclus în această etichetă va fi recunoscut de browsere ca un paragraf.

Fiecare etichetă din HTML are o semnificație specială și este responsabilă pentru afișarea anumitor date. Cazul literelor din numele etichetelor nu contează, de exemplu, eticheta

…

și etichetați

…

- Este la fel. Adică, etichetele pot fi scrise atât cu litere mici, cât și cu litere mari. Anterior, era o practică obișnuită să scrieți toate etichetele cu majuscule, astfel încât etichetele să fie diferite text simplu. Acum nu mai este nevoie, deoarece mulți editori au evidențiere de sintaxă.

Clasificarea etichetelor

Există mai mult de 90 de etichete în HTML. De obicei, o etichetă afectează doar o parte a documentului, de exemplu, eticheta de antet de la primul nivel.

…

. În astfel de cazuri, se folosesc etichete asociate: deschidereȘi închidere. Eticheta de deschidere (de exemplu,

) creează efectul, iar închiderea (

) — își oprește acțiunea. După cum puteți vedea din exemplu, eticheta de închidere are întotdeauna acest simbol ( / ) - bară oblică înainte. Aceste etichete sunt numite se dublează.

Unele etichete oferă un efect unic acolo unde apar. De exemplu, etichetați dungă orizontală

---

sau eticheta de afișare a imaginii . Astfel de etichete nu au etichete de închidere. Astfel de etichete se numesc non-împerechete.

Tipuri de etichete

În plus, etichetele sunt împărțite în mai multe tipuri, care diferă prin funcțiile lor:

• etichete cu titlul documentului;
• elemente de bloc;
• elemente inline;
• elemente universale;
• liste;
• Mese;
• rame.

Această diviziune nu este strictă, așa că există unele etichete grupuri diferite. De exemplu, etichete pentru crearea de liste

Și
se aplică atât listelor, cât și elementelor bloc.

Structura etichetei

Când sunt încărcate în browser, etichetele în sine nu sunt afișate, dar afectează modul în care este afișat conținutul lor. Dacă o etichetă este scrisă greșit, este ignorată în totalitate.

Toate etichetele au o anumită structură care trebuie urmată la scriere. În plus, aproape toate etichetele au diverse atribute care pot schimba modul în care este afișat conținutul.

Să aruncăm o privire la structura corecta etichete care conțin atribute:

1. 
2. Propriul dvs. webmaster

Ca exemplu, am dat două complet etichetă diferită. Primul singur - responsabil pentru afișarea imaginilor, atribut - src="logo.jpg". Al doilea … paired este responsabil pentru crearea linkurilor, atributul este href="site-ul web".

Concluzia 1: Atributele pot avea etichete asociate și neîmperecheate.

Concluzia 2: Numai etichetele de început pot avea atribute, etichetele de final nu au atribute.

Poza pentru clarificare: