HTML, prin definiție, nu poate fi un limbaj de programare, așa cum cred în mod eronat mulți oameni fără experiență. Limbajul HTML este, în principiu, o formulare inerent incorectă. Trebuie să-l numiți Hypertext Markup Language, deoarece HTML înseamnă - Hyper Text Markup Language. Pentru a spune trivial, HTML este o serie de etichete. Eticheta, la rândul său, este cuvântul de control, principalul. Etichetele oferă posibilitatea de a oferi textelor cu aspect standard un aspect formatat, adică să pună în cursiv, cu aldine, subliniați sau faceți o altă acțiune. Cu toate acestea, puteți face diferite acțiuni pe texte numai în specialitate programe de browser datorită căruia chiar călătorești retea globala la nivel mondial Web. Aceste programe afișează un singur text deja modificat și Etichete HTML folosite pentru modificare, se ascund. Pentru a face față mai bine la toate acestea și a înțelege rapid ce este în joc, chiar pe această pagină, faceți clic dreapta pe această pagină și selectați punctul „ Sursă' sau ceva similar în sens. Aceeași pagină va apărea în fața ta în forma ei adevărată.

Pentru a crea cod HTML, puteți folosi editoare de text standard și puteți folosi, de asemenea, editoare vizuale, acestea fiind adesea numite vizuale. Principala diferență dintre aceste tipuri de editori este că cele vizuale sunt special concepute pentru tastarea HTML - cod, coduri JavaScript, cssȘi PHP, precum și unele altele, și anume pentru programare web. În plus, astfel de editori vă oferă posibilitatea de a vedea imediat ce ați făcut în program și de a identifica (afișa) petele comise în codul tipărit. Vă sfătuim să introduceți codul direct cu propriile mâini, iar editorii vizuali vă vor simplifica munca. Puteți folosi browserul Macromedia Dreamweaver 8. Deși acest program nu este cel mai recent, funcționalitatea lui va fi suficientă pentru tine și chiar și cu un surplus. Cel mai bun mod de a face acest lucru este să tastați codul în program țesător de vise, apoi salvați și faceți clic pe butonul „Vizualizare în browser”, unde puteți schimba singur setul de browsere. După aceasta, treceți înapoi la Dreamweaver și reluați procesul de editare. În acest loc veți vedea crack-ul pentru Macromedia Dreamweaver 8. Așadar, v-am spus despre instrumente. Să trecem la etichetele HTML.

Pentru început, să ne familiarizăm cu structura paginii în codul HTML, sau mai bine zis, cu acele elemente care trebuie să fie întotdeauna strict prezente în ea.

Etichete de pagină imuabile în cod HTML:

, , , , ,

Vă rugăm să rețineți că mulți oameni, pentru ca programul să afișeze codul HTML sub formă de text, pun un spațiu după paranteza unghiulară de deschidere, adică un spațiu. Nu ar trebui să faceți acest lucru când introduceți codul!

Cu siguranță ați observat imediat că toate etichetele sunt asociate unul față de celălalt. O etichetă îl deschide, iar cealaltă îl închide. În codul HTML, aproape toate etichetele sunt asociate. Diferența dintre ele este că eticheta de închidere este precedată de o bară oblică /. Aceste etichete se mai numesc și etichete de container pentru că este posibil să se stabilească alte etichete între date, ca și cum le-ar fi definit într-un container. S-ar putea să vedeți deja cum sunt etichete Și altele sunt localizate. Este permisă tipărirea numelor de etichete atât în ​​majusculă, cât și în litere mari, nu va fi nicio diferență. Înregistrări precum Și pentru program nu vor avea nicio diferență și sunt interpretate de acesta în mod identic.

Deci, ce sunt etichetele imuabile pentru o pagină în cod HTML? Să luăm în considerare această întrebare mai detaliat.

Etichetă de deschidere si inchizand-o transmite informații către programele concepute pentru a reda pagini hipertext și alte browsere pe care le lucrează în mod specific cu materiale hipertext. Fiecare document din codul html începe întotdeauna cu , și se termină. Aceasta înseamnă că un întreg cod html este plasat între aceste două etichete.

Etichete Și încheie titlul materialului hipertext. Conține informații despre pagină în cod html. În principiu, aceste etichete nu sunt necesare, chiar dacă nu sunt, browserele interpretează perfect materialul tău html. Cu toate acestea, după ce a decis să nu scrieți titlul în document, introduceți în continuare . O astfel de mișcare este necesară pentru compatibilitate în diferite variante de browsere. Absolut fiecare caracter aflat în aceste etichete nu este în niciun fel descifrat de browser. Aceasta nu include doar informațiile din etichete , care conține chiar numele materialului html (numele este plasat în zona superioară a panoului browserului). Totuși, acest lucru poate afecta aspectul general al documentului html, modul în care acesta va exista pe web și va fi clasificat pe ierarhie în motoarele de căutare. Mai multe detalii despre etichetele plasate în titlul materialului hipertext vor fi discutate ulterior.

Întreaga esență a materialului în cod html plasate în etichete Și . Acest loc este absolut tot ce constă documentul nostru html și ceea ce contemplăm atunci când este implementat (imagini grafice, date text, butoane și alte elemente). Acesta este „corpul” principal al paginii sau de bază.

Alte etichete utilizate în procesul de generare a materialului html sunt situate în interiorul tuturor etichetelor neschimbate care sunt necesare. Aproape toate etichetele html conțin o varietate de parametri și atribute, cu ajutorul cărora veți putea recrea informațiile exact în forma în care au fost prezentate și dezvoltate. De exemplu, veți tasta:

Unde - eticheta în sine, bgcolor- atributul etichetei, „#FF0000”- semnificația acestui atribut. O etichetă are o serie de atribute.

Și astfel, tonul întregii pagini va deveni roșu.

Fiți atenți aici la faptul că atributele etichetei (fiecare) și semnificația lor sunt puse în eticheta de deschidere (fără bară oblică) și niciodată în eticheta de închidere.

Astfel, ați aflat despre etichetele imuabile ale paginii html. Dar înainte de a ne întoarce la studiul celorlalți, ne vom opri pentru o mică digresiune.

Folosind bagajele de cunoștințe dobândite, scăzute din tot felul de manuale despre bazele limbajului HTML pentru începători, în activitățile practice am identificat principala și foarte serioasă pată pe care au făcut-o mulți autori ai acestei literaturi. Conceput exclusiv pentru începători, toate acestea ghiduri de studiu iar manualele predau elementele de bază ale HTML secvențial, începând cu etichetele de titlu ale materialului hipertext ( ) și continuând să vă familiarizați cu etichetele de bază de documente ( ). În esență, toate acestea sunt, desigur, foarte corecte. Cu toate acestea, după cum arată experiența noastră practică, pentru începători, acest mod de a învăța elementele de bază ale HTML este inadecvat. Explorând nenumărate etichete de titlu care sunt complet obscure pentru ele însele, un începător nu va putea vedea roadele antrenamentului său, deoarece browserul nu interpretează aceste etichete și nu va putea aplica multe dintre ele în lucrul la creația sa. în orice fel (la începutul antrenamentului, cu siguranță). Deci orice începător își va pierde doar timpul și energia și, cel mai important, dorința de a face ceva în viitor și dacă să învețe HTML. În plus, ideea că munca de dezvoltare a unei resurse poate fi făcută doar de webmasteri cu experiență pentru o mulțime de bani va fi ferm înrădăcinată în capetele neexperimentate ale începătorilor. Prin urmare, vă sfătuim să lăsați totul de neînțeles pentru un timp și să mergeți mai departe. Apoi, după ce ați rezolvat totul clar, puteți învăța restul.

Bazele HTML conțin regulile de bază ale limbajului HTML, o descriere a structurii unei pagini HTML, relațiile în structura unui document HTML între elementele HTML.

Documentul HTML este normal Document text, poate fi creat ca de obicei editor de text (Caiet), iar într-una de specialitate, cu evidențiere de cod (Notepad++, Cod Visual Studio 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 pornire arată unde începe elementul, unde se termină. Etichetă de închidere format prin adăugarea unei bare oblice / înainte de numele etichetei:<имя тега> … . Între etichetele de început și de sfârșit se află conținutul etichetei - conținut.

Etichetele unice nu pot stoca conținut direct, este scrisă ca valoare de atribut, de exemplu, o etichetă va crea un buton cu text Buton interior.

Etichetele pot fi imbricate unele în altele, 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 unui element și conțin un nume și o valoare specificate în atributul format name="value" . Atributele vă permit să modificați proprietățile și comportamentul elementului pentru care sunt setate.

Fiecare element poate avea mai multe valori de clasă și o singură valoare de id. Mai multe valori de clasă sunt scrise cu un spațiu,

. Valorile de clasă și id trebuie să conțină numai litere, cifre, cratime și litere de subliniere și trebuie să înceapă numai cu litere sau cifre.

Browserul vizualizează (interpretează) un document HTML, construindu-i structura (DOM) și afișându-l conform instrucțiunilor incluse în acest fișier (fișe de stil, scripturi). Dacă marcajul este corect, atunci fereastra browserului va afișa o pagină HTML care conține elemente HTML - titluri, tabele, imagini și așa mai departe.

Procesul de interpretare (analizare)începe înainte ca pagina web să fie complet încărcată în browser. Browserele procesează secvențial documentele HTML de la bun început, în timp ce procesează CSS și leagă foile de stil cu elementele paginii.

Un document HTML este format din două secțiuni - titlul - între etichete … și conținut – între etichete … .

Structura paginii web

1. Structura documentului HTML

Limbajul 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 responsabil pentru afișarea corectă a paginii web de către browser. DOCTYPE definește nu numai versiunea HTML (de exemplu, html), ci și fișierul DTD corespunzător de pe web.

Elemente dintr-o etichetă , formează un arbore de documente, așa-numitul model de obiect document, DOM (model obiect document). În același timp, elementul este elementul rădăcină.

Orez. 1. Cea mai simplă structură a unei pagini web

Pentru a înțelege interacțiunea elementelor unei pagini web, este necesar să luăm în considerare așa-numitele "relatii de familie"între elemente. Relațiile dintre mai multe elemente imbricate sunt clasificate în relații cu părinți, copii și frați.

Strămoş 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:

,

, ,