HTML înseamnă H yper Text M arkup Language, adică. Hypertext Markup Language este elementul de bază al paginilor web, folosit pentru a crea și prezenta vizual pagini web.

HTML adaugă markup textului simplu. Hipertextul conține diverse link-uri prin care paginile web sunt conectate între ele. Cu HTML, oricine poate crea atât site-uri web statice, cât și dinamice. HTML este un limbaj care descrie structura și semantica conținutului unui document web. Conținutul unei pagini web este marcat folosind etichete care reprezintă elemente HTML. Exemple de astfel de elemente sunt: , și așa mai departe. Aceste elemente formează elementele de bază ale oricărui site web.

HTML a fost inventat în 1991 de omul de știință Tim Berners-Lee și a fost inițial destinat schimbului de documente între oamenii de știință de la diferite universități. Cu invenția sa, Tim Burns-Lee a pus bazele internetului modern.

Există mai multe versiuni de HTML. Standardul de limbă este actualizat și completat continuu și, ca urmare, o nouă versiune de HTML este lansată aproape în fiecare an. Versiunea „HTML 2.0” a fost prima specificație standard HTML, care a fost publicată în 1995. HTML 4.01 este versiunea majoră a HTML care a fost publicată la sfârșitul anului 1999 și este utilizat pe scară largă astăzi. Astăzi, cea mai populară versiune este HTML-5, care este o extensie a HTML 4.01, publicată în 2012.

Un document HTML sau o pagină web este un document text simplu care conține etichete (care, la rândul lor, sunt text simplu cuprins între paranteze unghiulare). O pagină web poate fi tastată fie într-un editor de text obișnuit (Notepad, WordPad, Word etc.) fie într-unul specializat cu evidențiere de cod (Notepad++, Sublime Text etc.). Documentele HTML sunt stocate ca fișiere cu extensia .htm sau .html.

Pe măsură ce prezentăm materialul, fiecare lecție va oferi exemple care vă vor ajuta să înțelegeți fiecare cod în detaliu și, prin practică, să vă bucurați de învățare. Cu editorul nostru HTML online, puteți edita un document HTML și apoi faceți clic pe butonul portocaliu „Run” din editor, care se află deasupra ferestrei editorului din stânga pentru a vedea rezultatul. Dacă utilizați un editor HTML specializat, atunci puteți copia exemplul și vizualiza rezultatele muncii dvs. în browserul instalat pe computer.

Acesta este un paragraf.

Tutorialul HTML vă oferă peste 100 de exemple online care vă vor ajuta să stăpâniți cu ușurință limbajul de marcare. E mai bine să vezi o dată decât să auzi de o sută de ori! Teoria plus practica este cheia succesului tău în stăpânirea HTML-ului.

HTML Basics conține regulile de bază ale limbajului HTML, o descriere a structurii unei pagini HTML și relațiile din structura unui document HTML între elementele HTML.

Un document HTML este un document text obișnuit care poate fi creat fie într-un editor de text obișnuit (Notepad), fie într-unul specializat cu evidențiere de cod (Notepad++, Visual Studio Code etc.). Un document HTML are extensia .html.

Un document HTML constă dintr-un arbore de elemente HTML și text. Fiecare element este identificat în documentul sursă printr-o etichetă de început (deschidere) și de sfârșit (închidere) (cu rare excepții).

Eticheta de început arată unde începe elementul, eticheta de final arată unde se termină. Eticheta de închidere se formează prin adăugarea unei bare oblice / înainte de numele etichetei: .... Între etichetele de început și cele de închidere se află conținutul etichetei - conținutul.

Etichetele unice nu pot stoca conținut direct; este scrisă ca valoare de atribut, de exemplu, o etichetă va crea un buton cu textul Button în interior.

Etichetele pot fi imbricate una în alta, de exemplu,

Text

Text

Elementele HTML pot avea atribute (globale, aplicate tuturor elementelor HTML și propriile lor). Atributele sunt scrise în eticheta de deschidere a elementului și conțin un nume și o valoare, specificate în formatul atribut name="value" . Atributele vă permit să modificați proprietățile și comportamentul elementului pentru care sunt setate.

Fiecărui element i se pot atribui mai multe valori de clasă și o singură valoare de id. Mai multe valori de clasă sunt scrise separate printr-un spațiu, . Valorile de clasă și id-ul trebuie să fie compuse numai din litere, cifre, cratime și caractere de subliniere și trebuie să înceapă doar cu litere sau cifre.

Browserul vizualizează (interpretează) documentul HTML, construindu-i structura (DOM) și afișându-l în conformitate cu instrucțiunile incluse în acest fișier (fișe de stil, scripturi). Dacă marcajul este corect, fereastra browserului va afișa o pagină HTML care conține elemente HTML - anteturi, tabele, imagini etc.

Procesul de interpretare (parsare) începe înainte ca pagina web să fie complet încărcată în browser. Browserele procesează documentele HTML secvenţial, de la început, în timp ce procesează CSS şi relaţionează foile de stil cu elementele paginii.

Un document HTML este format din două secțiuni - antetul - între etichete ... și partea de conținut - între etichete ....

HTML urmează regulile conținute în fișierul de declarare a tipului de document (Definiția tipului de document sau DTD). Un DTD este un document XML care definește ce etichete, atribute și valorile acestora sunt valabile pentru un anumit tip HTML. Fiecare versiune de HTML are propriul DTD.

DOCTYPE este responsabil pentru afișarea corectă a unei pagini web de către browser. DOCTYPE specifică nu numai versiunea HTML (de ex. html), ci și fișierul DTD corespunzător de pe Internet.

...

Elementele din interiorul etichetei formează un arbore de document, așa-numitul model de obiect document, DOM (model de obiect de document). În acest caz, elementul este elementul rădăcină.

Pentru a înțelege interacțiunea elementelor paginii web, este necesar să se ia în considerare așa-numitele „relații de familie” dintre elemente. Relațiile dintre mai multe elemente imbricate sunt clasificate ca părinte, copil și soră.

Un strămoș este un element care conține alte elemente. În figura 1, strămoșul pentru toate elementele este . În același timp, elementul este strămoșul tuturor etichetelor pe care le conține: ,

.

Un descendent este un element situat într-unul sau mai multe tipuri de elemente. De exemplu, este un descendent al , și elementul

Este un descendent al ambelor și .

Un element părinte este un element care este legat de alte elemente la un nivel inferior și este situat deasupra lor în arbore. În figura 1 și . Etichetă

Este părinte numai pentru .

Un element copil este un element care este direct subordonat unui alt element la un nivel superior. În figura 1 există doar elemente , ,

Și sunt copii ai .

Un element soră este un element care are un element părinte comun cu cel în cauză, așa-numitele elemente de același nivel. În figura 1 și sunt elemente de același nivel, precum și elemente , și

Sunt surori una cu cealaltă.

Secțiunea... conține informații tehnice despre pagină: titlu, descriere, cuvinte cheie pentru motoarele de căutare, codificare etc. Informațiile pe care le introduceți acolo nu sunt afișate în fereastra browserului, dar conțin informații care îi spun browserului cum să proceseze pagina.

Eticheta de secțiune necesară este . Textul plasat în interiorul acestei etichete apare în bara de titlu a browserului web. Titlul nu trebuie să aibă mai mult de 60 de caractere pentru a se încadra complet în titlu. Textul titlului trebuie să conțină cea mai completă descriere a conținutului paginii web.

O etichetă de secțiune opțională este o singură etichetă. Cu ajutorul acestuia, puteți seta o descriere a conținutului paginii și a cuvintelor cheie pentru motoarele de căutare, autorul documentului HTML și alte proprietăți ale metadatelor. Un element poate conține mai multe elemente, deoarece poartă informații diferite în funcție de atributele utilizate.

Descrierea conținutului paginii și a cuvintelor cheie pot fi specificate simultan în mai multe limbi, de exemplu, în rusă și engleză:

Folosind o etichetă, puteți bloca sau permite indexarea unei pagini web de către motoarele de căutare:

Pentru a reîncărca automat pagina după o anumită perioadă de timp, trebuie să utilizați valoarea de reîmprospătare:

Pagina va fi reîncărcată după 30 de secunde. Pentru a redirecționa vizitatorul către o altă pagină, trebuie să specificați adresa URL în parametrul URL: