Totul despre descrierea și utilizarea html. Ce este HTML? Structura documentului HTML

World Wide Web este alcătuit din pagini Web, iar aceste pagini sunt create folosind HyperText Markup Language (HTML). Deși mulți oameni, în special începătorii, vorbesc astăzi despre „Programare (cu P majuscule) în HTML”, HTML nu este deloc un limbaj de programare. HTML este un limbaj de marcare. Folosiți HTML pentru a marca un document text, la fel cum un editor ar folosi un creion roșu gros. Aceste semne servesc pentru a determina formatul (sau stilul) care va fi utilizat la afișarea textului pe ecranul monitorului.

Structura documentului HTML

M în abrevierea HT M L înseamnă „marcare”.

Textul este marcat cu etichete, care sunt cuvinte cheie de limbă cuprinse între paranteze unghiulare "<" и ">".

Mai des sunt folosite în perechi pentru a marca începutul și sfârșitul unui text.

Îl marchează astfel încât browserul să afișeze textul pe ecran în forma specificată de etichete.

Eticheta de închidere diferă de eticheta de deschidere prin prezența unei bare oblice „/”.

Unele etichete au atribute care specifică modul în care ar trebui să fie afișat conținutul. Atributele pot fi specificate numai în eticheta de deschidere.

Desigur, nu se poate face fără comentarii. Ele servesc pentru comoditatea dezvoltatorului, pentru clarificare. Comentariile nu sunt procesate de browser și nu sunt afișate, dar sunt descărcate împreună cu întregul document și afectează timpul de încărcare. Prin urmare, atunci când adăugați comentarii, trebuie să respectați „mijlocul de aur”.

Comentariile sunt incluse între fragmenteși poate cuprinde mai multe linii.

Vedere generală a documentului HTML:
Titlul documentului HTML (nu este afișat pe ecran) Corpul documentului HTML (afișat pe ecran)

Prima etichetă este identificatorul standardului HTML utilizat. Exemplul prezentat este setat să se conformeze celui mai recent standard HTML5.

Informații din antet

Container conține informații pentru browsere și motoarele de căutare.

Între o pereche de etichete ...

Întregul conținut al paginii web este stocat și afișat pe ecranul monitorului în fereastra browserului.

Ce este HTML și pentru ce este? - 3,7 din 5 pe baza a 3 voturi

Înainte de a începe să studiez, îmi propun să luăm în considerare ce este html și la ce este destinat.

HTML înseamnă Hyper Text Markup Language, care poate fi tradus ca limbaj de marcare hypertext. Paginile de internet sunt create folosind acest limbaj.

HTML nu este un limbaj de programare. Este conceput pentru marcarea documentelor text. Adică, în general, îl folosim pentru a formata textul.

Deci, cum putem edita text folosind HTML? Faptul este că limbajul HTML constă din etichete. Fiecare etichetă determină cum va arăta textul de pe pagina ta.

Cu alte cuvinte, fiecare etichetă dă o comandă specifică browserului dumneavoastră (programul cu care vizualizați paginile de internet), browserul înțelege această comandă și afișează pe ecran un text gata făcut formatat într-un anumit fel.

Prin urmare, nu vedeți codul în sine; browserul afișează text și grafice formatate gata făcute pe ecranul monitorului. Dacă doriți să vedeți codul html în sine și etichetele cu care este formatat textul pe care îl citiți în prezent, atunci accesați elementul de meniu > vizualizați în browserul dvs. Internet Explorer și selectați > sursă din lista derulantă. Uitate la imagine.

Ca rezultat, se va deschide o fereastră care conține codul. Similar cu cel pe care îl puteți vedea în a doua poză. Puteți derula și privi acest cod, acesta constă în principal din etichete, care în cele mai multe cazuri au text în interior. Astfel, fără a intra în detalii, putem spune că fiecare etichetă determină unde, cum, ce font, ce culoare va arăta textul tău.

Dar, de fapt, etichetele HTML pot face mai mult decât formatarea textului; cu ele puteți insera o imagine într-o pagină, puteți crea tabele, puteți crea link-uri și multe altele.

Fiecare etichetă își îndeplinește propriile funcții specifice și, pentru a învăța cum să creezi pagini web, trebuie să știi pentru ce este destinată aceasta sau acea etichetă. Cred că acum înțelegi puțin ce este html.

Mai întâi, să vedem ce este o etichetă. Pentru a spune foarte simplu, etichetele constau din caractere sau cuvinte obișnuite în limba engleză, doar aceste litere și cuvinte sunt proiectate într-un anumit fel.

Fiecare etichetă constă din paranteze unghiulare,< >în interiorul căruia sunt plasate anumite simboluri. Cele mai multe dintre ele constau în deschidere și închidere.

De exemplu, eticheta - deschidere, și- inchidere. După cum puteți vedea, ele diferă prin prezența unei bare oblice / în simbolul de închidere. Dacă puneți vreun cuvânt între ele, de exemplu, Buna ziua apoi va fi afișat cu caractere aldine. Tot ceea ce este inclus în paranteze unghiulare în acest caz nu este afișat pe ecran, ci este un fel de comandă pentru browser că cuvântul care este inclus între aceste etichete ar trebui să fie afișat cu caractere aldine.

În mod natural, există multe etichete și fiecare dintre ele își îndeplinește propriile funcții specifice. Toate celelalte etichete și întregul HTML funcționează aproximativ pe același principiu. Când solicitați orice document de pe Internet, browserul dvs. descarcă codul html, îl interpretează corect și afișează pe ecran text formatat gata făcut, grafice, tabele etc.

Scopul acestei lecții a fost de a vă oferi o idee despre ce este HTML; în lecțiile următoare vom începe să studiem acest limbaj de marcare. Pentru a vă facilita învățarea materialului, vă recomand să începeți să studiați lecțiile cu cele mai simple, trecând ușor la cele mai complexe, de exemplu în următoarea secvență: la început, studiați modul în care se folosește un document pentru a seta și produceți, învățați cum să setați, etc. la mai complex.

Pentru a crea pagini HTML, puteți utiliza programe speciale, cum ar fi, sau puteți crea pagini folosind un editor de text simplu, care este disponibil în orice versiune de Windows.

Pentru apariția HTML, lumea modernă are de mulțumit unui om de știință de la Consiliul European pentru Cercetare Nucleară (Conseil Européen pour la Recherche Nucléaire, CERN). Numele acestui om de știință este Timothy John Berners-Lee. Prima versiune de HTML a fost creată în scopul formatării documentelor științifice. Este formatare structurală fără elemente de descriere a schemelor de culori, parametrilor fontului etc. Astfel, HTML a făcut inițial posibilă evidențierea titlurilor, paragrafelor, listelor și elementelor structurale similare în text. Rezultatul procesării sau „redării” HTML nu ar trebui să depindă de caracteristicile tehnice ale hardware-ului pentru vizualizarea acestuia, deoarece nu conținea parametrii acestei vizualizări. De-a lungul timpului, această caracteristică a limbajului de marcare hipertext a fost parțial pierdută.

Așadar, apariția primelor versiuni de HTML datează din 1986, iar în 1991 HTML a fost îmbunătățit semnificativ și a început să fie folosit special pentru transmiterea hipertextului pe World Wide Web. Ei spun că abrevierea de renume mondial HTML, care înseamnă Hyper Text Markup Language, a apărut exact la începutul anilor 90 ai secolului trecut. Și acum o scurtă excursie în pedigree-ul limbajelor de marcare. Prima versiune a limbajului de marcare hipertext HTML a fost creată pe baza Standardului Generalized Markup Language (SGML), care într-un fel poate fi considerat un prototip al limbajului de marcare eXtensible. Standardul XML a câștigat o popularitate imensă în timpul nostru datorită numărului mare de extensii utilizate în tehnologia computerelor. Pentru a deruta complet cititorul, voi adăuga imediat că ulterior, pe baza XML, a fost dezvoltat limbajul de marcare hipertext XHTML (Extensible Hypertext Markup Language), care reproduce în esență HTML. Ca rezultat, avem acronimele SGML, HTML, XML și XHTML și trebuie să înțelegem care este care. De fapt, totul este simplu: SGML nu este altceva decât un set de reguli pe baza cărora poate fi construit orice limbaj de marcare. HTML este una dintre aceste limbi - aplicația SGML. Cu alte cuvinte, SGML definește cum ar trebui să arate elementele de markup, iar HTML definește ce anume ar trebui să fie elementele și cum ar trebui să fie interpretate de browsere. XHTML, la rândul său, este o aplicație a XML, iar XML în sine nu este altceva decât o versiune simplificată a SGML. , în ciuda faptului că sunt foarte asemănătoare ca aspect, au diferențe ascunse semnificative, care, în cea mai mare parte, se află în principiul prelucrării lor.

Acum să revenim la istoria dezvoltării HTML. Deci, până în 1994, HTML era încă folosit doar pentru marcarea structurală a datelor, deși includea deja etichete pentru evidențierea textului cu caractere aldine sau cursive. În același 1994, a fost creată organizația W3C (World Wide Web Consortium) - World Wide Web Consortium, care este condus, destul de logic, de același Tim Berners-Lee, iar în 1995 a fost publicată recomandarea HTML 2.0. Creatorii de HTML au înțeles deja că, în timp, creația lor va evolua dintr-un limbaj de marcare statică a textului în principalul instrument de creare a resurselor dinamice de Internet. Adăugarea principală a HTML 2.0 a fost apariția ca parte a limbajului formularelor cu seturi de controale de utilizator care urmau să fie folosite pentru ca utilizatorul să introducă parametrii pentru solicitările HTTP.

După lansarea celei de-a doua versiuni, au început imediat lucrările la următoarea generație de HTML. În 1997, a fost lansată recomandarea HTML 3.2, care a completat limbajul de marcare cu tabele, cadre, imagini și alte etichete importante. Dar cea mai importantă realizare a versiunii a 3-a este că autorii acesteia au revenit din nou la problema vizualizării marcajului în browser, amintindu-și că HTML ar trebui doar să marcheze structura documentului și nu ar trebui să conțină direct parametri pentru stilurile grafice pentru afișarea elementelor în browserul. Rezultatul muncii lor pe HTML 3.2 a fost apariția unui limbaj CSS independent (Cascading Style Sheets) - foi de stil în cascadă, al căror cod poate fi acum conectat la codul de markup HTML și, prin urmare, poate personaliza aspectul paginii.

Până la lansarea versiunii 4 de HTML în 1997, personalul W3C a scăpat de la ideea acelor elemente inutile care, odată cu apariția CSS, deveniseră învechite și au compromis ideea de a separa structura de marcare de parametrizarea prezentării. Dar nimeni nu ar bloca o nouă versiune din cauza unor astfel de fleacuri. Principala realizare a recomandărilor HTML 4.0 a fost apariția modelului de obiecte de pagină (Document Object Model, DOM), ale cărui elemente puteau fi acum manipulate prin limbaje de programare de scriptare executate de browsere. Cel mai popular astfel de limbaj de programare este JavaScript. HTML plus DOM plus JavaScript este egal cu HTML dinamic sau pur și simplu DHTML, care a marcat o descoperire în designul web. Acum elementele unei pagini de Internet încărcate își pot schimba aspectul ca răspuns la acțiunile utilizatorului, precum și să adauge noi și să ștergă elemente existente. Pe 24 decembrie 1999, a fost lansată cea mai recentă ediție a celei de-a patra versiuni a limbajului de marcare hipertext, HTML 4.01.

HTML5 nu a primit încă statutul de recomandare oficială W3C, dar este deja clar că autorii HTML continuă să lucreze pentru dezvoltarea cerințelor pentru suportul modelului obiect document și interpretarea JavaScript. Deși HTML5 va primi o serie de etichete noi, majoritatea recomandărilor se referă în continuare la comportamentul browserului în contextul DHTML: va exista suport încorporat pentru funcțiile drag-and-drop, capacitatea de a desena pe o pânză virtuală , controlați istoricul de navigare și partajați mesaje între pagini, salvați contextul de execuție și multe altele. Se speră că odată cu lansarea de noi recomandări HTML, problemele lipsei de compatibilitate între browsere, atunci când același cod JavaScript este executat diferit în browsere diferite, vor dispărea treptat. La urma urmei, tendința de a defini cerințele pentru lucrul cu modelul obiect și JavaScript va continua, iar dezvoltatorii de browsere vor fi obligați (dacă doresc ca produsele lor software să fie utilizate) să respecte aceste cerințe.

HTML5 este programat pentru lansare în 2014. Poate că până atunci W3C va fi dezvoltat recomandări separate referitoare doar la programarea JavaScript, iar HTML va deveni în cele din urmă din nou exclusiv un limbaj de marcare pentru structura documentului. În ciuda faptului că astăzi este doar 2012, multe sunt deja acceptate de cele mai populare browsere. Multe lucruri pe care designerii web trebuiau să facă anterior pe cont propriu (același drag-and-drop), odată cu lansarea HTML5 vor fi suportate la nivel de browser, iar această dezvoltare a evenimentelor nu poate decât să se bucure. Nu putem decât să sperăm că tendința va continua.

Internetul este o rețea mondială care unește rețelele de calculatoare din întreaga lume pe baza unor acorduri standard uniforme (protocoale) privind metodele de schimb de informații și un sistem de adresare unificat.

Până în prezent, internetul a câștigat o popularitate fără precedent. Potrivit experților, internetul conectează peste 100 de milioane de computere. Peste 300 de milioane de oameni din 170 de țări folosesc serviciile de internet.

Din punct de vedere funcțional, internetul este:

ü un mijloc ieftin, rapid de comunicare între abonații din întreaga lume;

ü un depozit fără egal de informații despre orice domeniu de cunoaștere;

ü un nou mediu promițător pentru activitate.

Influența Internetului se extinde nu numai în domeniul tehnologic al comunicațiilor computerizate, el are și o orientare socială și pătrunde în întreaga societate pe măsură ce mijloacele operaționale de obținere a cunoștințelor și comerțul electronic devin tot mai răspândite.

Cel mai răspândit și solicitat astăzi este un astfel de serviciu de internet ca WWW (World Wide Web − World Wide Web). Informațiile de pe WWW sunt prezentate sub formă de așa-numite documente hipertext (sau, mai larg, hipermedia), care pot conține text formatat, grafică, fragmente audio și video. Principala caracteristică a documentelor hipertext este prezența zonelor active care sunt sensibile la un clic de mouse. Fragmente de text pot fi active, imagini întregi și părți ale acestora; clic pe zona activă determină descărcarea documentului (țintă) asociat acestei zone.

Pentru a învăța cum să postați materiale pe Internet, trebuie mai întâi să vă familiarizați cu limbajul de marcare hipertext HTML (H yper T ext M arkup L Engleză)

Bazele HTML

Limbajul de marcare pentru documentele hipertext HTML este un set de comenzi numite tag-uri (din engleză etichetă Etichetele HTML găsite în textul unui document sunt interpretate de browser la afișarea documentului.

Vizualizarea documentelor HTML se realizează folosind programe - browsere(din engleza browser), care afișează documentul în funcție de marcaj HTML și oferă navigare prin hyperlink. Cele mai comune browsere suntMicrosoftInternetExplorator Microsoft Corporation și NetscapeNavigator de la Netscape Communications Corporation.

Deoarece un document HTML este un fișier text, acesta poate fi pregătit într-un editor de text simplu, cum ar fi Notepad ( Blocnotes), dar necesită foarte multă muncă. Mai des, se folosesc editori specializați, proiectați special pentru pregătirea documentelor HTML, care vă permit să inserați etichete folosind butoanele din bara de instrumente sau comenzile de meniu și să setați atributele etichetelor în casetele de dialog, de exemplu, Macromedia țesător de vise, MicrosoftPrima paginaHomeSite si etc.

Un document HTML poate fi obținut prin conversia acestuia într-un format HTML, de exemplu, din formatul de document Microsoft Office. De remarcat că la o astfel de transformare, textul sursă al documentului HTML se dovedește a fi extrem de redundant și necesită corectare.Este mult mai eficient să folosești editori HTML speciale.

Sintaxa etichetelor HTML

O etichetă HTML este scrisă între paranteze unghiulare (caractere) și constă dintr-un nume, care poate fi urmat de o listă de atribute (opțional pentru majoritatea etichetelor). Numele și atributele sunt cuvinte și abrevieri englezești.

Etichetele pot fi împărțite în două grupe:

Dubleetichete (numite și containere) au două componente: deschidere (inițială) și închidere (finală); componenta de închidere are același nume, dar atunci când este scris, numele este precedat de o bară oblică (simbolul / ). Textul documentului și alte etichete pot fi amplasate între componentele de deschidere și de închidere. Fragmentul de document situat între elementele de deschidere și de închidere ale etichetei containerului este formatat de browser în funcție de semnificația etichetei. De exemplu, textul situat între etichete Și, va fi afișat cu caractere aldine (numele etichetei este din engleză îndrăzneţ). Etichetele pereche pot fi imbricate, dar nu trebuie să se suprapună.

Neperecheetichete (numite și autonom) nu au o componentă finală.Când sunt interpretate, în documentul afișat se introduce unul sau altul obiect. De exemplu, etichetați , care apare în textul unui document HTML, face ca imaginea grafică din fișierul pict.gif să fie inserată.

Atributele din listă sunt separate între ele prin unul sau mai multe spații, sau caractere de tabulație sau caractere newline; ordinea în care sunt scrise atributele nu este importantă. Marea majoritate a atributelor sunt folosite ca pereche nume atribut = valoarea atributului. Când valoarea atributului este mai mult de un cuvânt sau un număr, ar trebui să fie cuprinsă între ghilimele simple sau duble. Atributele nu sunt specificate în componentele de închidere ale etichetelor.


Iată un exemplu de etichetă cu atribute:

Nume eticheta Numele atributului

Valoarea atributului

Numele atributului

Valoarea atributului

Buna ziua !

După ce a întâlnit o astfel de etichetă într-un document HTML, browserul o interpretează, afișând textul care urmează etichetei în caractere mărite față de dimensiunea de bază (SIZE=+2) și culoarea roșie (CULOARE=ROȘU); această formatare a textului este aplicată până când este întâlnită eticheta de închidere.

Cazul caracterelor din intrările de etichete și atribute nu contează.

Structura documentului HTML

Un document HTML este inclus în etichetele și. Între aceste etichete există două secțiuni: secțiunea antet (între etichete și) și secțiunea de corp a documentului (între etichete și). Secțiunea antet conține o descriere a parametrilor. folosit la afișarea documentului, dar nu reflectat direct în fereastra browserului .Secțiunea corpul documentului conține textul principal destinat afișării de către browser, etichete de formatare, plasare de imagini, tabele, hyperlinkuri etc.

HTML - codul celui mai simplu document potrivit pentru postare pe Internet arată astfel:

< TITLU > Prima noastră pagină TITLUL >

Cel mai simplu document HTML

Acest cod poate fi introdus în editorul de text Notepad și salvat ca fișier cu extensia . htm sau. html − în acest caz, documentul se va deschide în browserul implicit instalat pe computer. Browserul va afișa acest document afișând în fereastra sa rândul „Cel mai simplu document HTML” aflat în secțiunea de corp a documentului. Expresia „Prima noastră pagină” va apărea în bara de titlu a browserului.

Secția CAP

Secțiunea antet conține de obicei etichete care sunt invizibile pentru utilizator, dar care totuși pot influența activ aspectul documentului.

Etichetă

Scop

Specifică numele întregului document. Numele este de obicei afișat în bara de titlu a ferestrei browserului. Acest element este necesar pentru orice document HTML și poate fi specificat nu mai mult de o dată.

Specifică adresa de bază (URL) a documentului curent, care va fi punctul de plecare pentru calcularea adreselor URL relative din document. Elementul nu are o etichetă de final. Cel puțin unul dintre argumente trebuie să fie prezent:

HREF- determină adresa de bază (URL) a documentului curent.

ŢINTĂ- definește numele cadrului care va fi folosit în hyperlinkuri în mod implicit. Acest lucru poate fi util dacă doriți să deschideți toate linkurile dintr-un document într-un cadru diferit.

< STYLE TYPE= "text/css ">

Folosit pentru a insera foi de stil în cascadă (CSS - Cascade Style Sheet) într-un document. TYPE este un atribut obligatoriu a cărui valoare este de obicei " text/css".

< МЕТА …>

Elementul META este utilizat pentru a descrie documentul din punct de vedere tehnic. Cu ajutorul acestui element, în titlul documentului sunt introduse informații suplimentare utile, invizibile pentru utilizator, dar uneori pur și simplu de neînlocuit pentru indexarea corectă a paginii dumneavoastră de către roboții motoarelor de căutare. Elementul nu are o etichetă de final.

NUME - definește numele metapostării. Există multe nume predefinite, dintre care unele le puteți vedea în exemplul de mai jos.

CONȚINUT - atribuie valoarea meta-intrarilor definite în parametrul NAME.

Sectiunea CORP

Această secțiune include conținutul principal al paginii web - text document, imagini, tabele etc. Elementul BODY trebuie să apară nu mai mult de o dată într-un document și poate include următoarele atribute:

Sintaxa atributelor

Scop

MARGINHEIGHT= număr

Specifică lățimea (în pixeli) a marginilor de sus și de jos ale documentului. Funcționează numai în browserele Netscape

TOPMARGIN= număr

Specifică lățimea (în pixeli) a marginilor de sus și de jos ale documentului. Funcționează numai în browserele Internet Explorer

MARGINWIDTH= număr

Specifică lățimea (în pixeli) a marginilor din stânga și din dreapta documentului. Funcționează numai în browserele Netscape

LEFTMARGIN= număr

Specifică lățimea (în pixeli) a marginilor din stânga și din dreapta documentului. Funcționează numai în browserele Internet Explorer

FUNDAL= URL

Specifică imaginea pentru a „umple” fundalul (imaginea de fundal). Valoarea este specificată în adresa absolută sau relativă a imaginii (vezi secțiunea Amplasarea desenelor)

BGCOLOR= culoare

Specifică culoarea de fundal a documentului.

MicrosoftInternetExploratoracceptă 16 nume standard de culori ( acva, negru, albastru, fucsia, gri, verde, lime, maro, bleumarin, măsline, violet, roșu, argintiu, verdeață, galben, alb)

O altă modalitate este să utilizați un cod de culoare sub forma unui număr hexazecimal de șase cifre care specifică intensitatea componentelor roșii (primele două cifre), verde (următoarele două cifre) și albastre (ultimele două cifre). Intensitatea fiecărei componente în formă hexazecimală variază de la 00 la FF. Când se specifică o culoare ca valoare de atribut pentru o etichetă, numărul hexazecimal este precedat de un caracter #.

De exemplu, înregistrați COLOR="#0000 FF „ înseamnă culoare albastră

În ciuda posibilității fundamentale de a specifica milioane de culori, trebuie luat în considerare faptul că browserele afișează doar 256 de culori, iar fiecare browser are propria paletă de culori.În această paletă, browserul va selecta culoarea cea mai apropiată de cea specificată.

TEXT= culoare

Specifică culoarea textului dintr-un document

LINK= culoare

Specifică culoarea hyperlinkurilor dintr-un document

ALINK= culoare

Definește culoarea de evidențiere a hyperlinkurilor atunci când se face clic.

VLINK

Definește culoarea hyperlink-urilor către documente deja vizualizate

Formatarea textului

Formatarea caracterelor

Toate etichetele de formatare a caracterelor au atât o componentă de deschidere, cât și una de închidere și acționează asupra textului cuprins între ele.

Principala este eticheta ... FONT>, folosit neapărat cu unul sau mai multe atribute care modifică dimensiunea, culoarea și fontul fontului:

Sintaxa atributelor

Scop

DIMENSIUNE = sens

Mărimea este specificată fie ca valoare absolută (un număr de la 1 la 7), fie relativ la dimensiunea fontului de bază (sub forma +n sau -n).

CULOARE= culoare

Culoare

FATA = lista de fonturi

Fonturi pentru afișarea textului; numele sunt listate în ordinea preferințelor separate prin virgule, de exemplu,FACE="Verdana,Helvetica,Arial,Sans-Serif"

De asemenea, puteți specifica unul dintre fonturi, dar rețineți că este posibil ca acest font să nu fie instalat pe computerul utilizatorului, iar fonturile „exotice” nu vor fi afișate de browser.

În plus, etichetele sunt folosite pentru a schimba stilul caracterelor:

. .. (din engleză bold) − font bold;

.. . (din engleză italic) - italic;

... (din engleză TeleType) – font monospace;

... (din engleza u subliniat) – subliniat;

... S > (din englezăs trikethrough) - tăiat;

... (din engleza s ub scenariu) – indice;

... (din engleză sup erscript) este superscriptul.

Text inclus între etichete

și (din engleză pre formatat), este afișat așa cum a fost preformatat, cu toate spațiile și întreruperile de rând.

Formatarea paragrafelor

Textul este afișat în fereastra browserului cuvânt cu cuvânt; când se ajunge la marginea din dreapta a ferestrei, următorul cuvânt este mutat automat pe o linie nouă. Chiar dacă în codul paginii au fost introduse mai multe spații sau textul a fost scris pe o linie nouă, aceste acțiuni nu vor fi afișate atunci când sunt vizualizate într-un browser. Prin urmare, pentru a afișa o serie de spații consecutive sau mai multe rânduri goale în text, trebuie să utilizați diverse etichete.

Etichetă
(din engleză b reak) întrerupe fluxul de text și inserează o nouă linie fără a crea un nou paragraf. Etichete multiple consecutive
sunt interpretate ca mai multe linii goale. Spațierea dintre linii este unică. Eticheta nu are componentă de închidere și nici atribute.

Etichetă (din engleză p agraf)începe un paragraf; un paragraf nou este separat de cel anterior prin spațiere dublă între rânduri. Un paragraf nu poate fi gol, adică mai multe etichete consecutive

sunt interpretate ca una (spre deosebire de eticheta
).Componenta de inchidere

opțional, deoarece paragraful anterior se termină acolo unde începe cel nou. Eticheta are un atribut opțional ALIGN care indică tipul de aliniere al paragrafului, care poate lua valorile LEFT, CENTER, RIGHT și JUSTIFICA , care setează alinierea la stânga, centru, dreapta și, respectiv, lățime. Textul inclus în etichete va fi de asemenea centrat.

...

Dacă componenta de închidere

omiteți, tipul de aliniere specificat este păstrat până la următoarea etichetă care specifică alinierea sau până la sfârșitul documentului.

HTML vă permite să creați paragrafe formatate ca liste numerotate sau cu marcatori. Un fragment de text, care este o listă, este inclus în etichete:

listă ordonată (numerotată) (din engleză o ordonat l ist)

listă neordonată (cu marcatori) (din engleză u nordizat l ist)

Fiecare element al unei liste ordonate sau neordonate este inclus în etichete... (din engleză l ist i tem). La afișarea textului, fiecare element de listă va fi plasat pe o nouă linie, indicată printr-un număr sau marcator. În plus, lista poate avea un titlu, care este specificat printr-o etichetă (din engleză l ist h eader). Etichetele de închidere nu sunt necesare.

Lista numerotata

Listă cu puncte

Element de cod

< O L>

Titlu

Primul element

Al doilea element

Al treilea element

< U L>

Titlu

Primul element

Al doilea element

Al treilea element

U L>

Afișarea browserului

Titlu

1. Primul element

2. Al doilea element

3. Al treilea element

Titlu

· Primul element

· Al doilea element

· Al treilea element

O listă cu mai multe niveluri poate fi organizată printr-o combinație de liste numerotate și cu marcatori.

Eticheta are atribute opționale:

Sintaxa atributelor

Scop

TIP = format

Formatul de numerotare poate avea următoarele valori:

Cifre arabe (implicit)

litere mari

literă mică

cifre romane mari

cifre romane mici

START = valoare

primul număr din listă (implicit 1)

Eticheta are un atribut opțional

Sintaxa atributelor

Scop

TIP = format

Formatul jetonului poate avea următoarele valori:

Disc

disc (implicit)

Cerc

cerc

Pătrat

Pătrat

Paragrafele pot fi formatate și ca titluri de nivel (de la n =1 la n =6), în acest scop etichete ca n >... n >. Titlul primului nivel este afișat cu cel mai mare font.

Etichete

, ... ,

poate avea un atribut de aliniere ALIGN cu valorile LEFT, RIGHT și CENTER.

Amplasarea desenelor

Imaginile care sunt afișate de browser atunci când vizualizați o pagină web sunt stocate în fișiere separate de format gif, jpg (jpeg) sau png , iar în codul paginii se face un link către fișierul solicitat. Pentru aceasta, se folosește o etichetă neîmperecheată, care are un atribut obligatoriu și un număr de atribute opționale.

Atribut necesar:

SRC = url

Adresă grafică a fișierului (relativă sau absolută)

ALT= text

Text alternativ afișat în modul browser fără încărcarea imaginilor (trebuie inclus între ghilimele)

BORDA = sens

Grosimea chenarului în pixeli, 0 înseamnă că nu există chenar (implicit)

BORDERCOLOR = culoare

Setează culoarea chenarului

ÎNĂLȚIE = sens

Înălțimea imaginii în pixeli (originală în mod implicit) sau ca procent din înălțimea ferestrei browserului

LĂȚime = sens

Lățimea imaginii în pixeli (originală în mod implicit) sau ca procent din lățimea ferestrei browserului

HSPACE = sens

Spațiu liber la stânga și la dreapta imaginii în pixeli

VSPACE = sens

Spațiu liber deasupra și dedesubtul imaginii în pixeli

ALIGN = sens

Aliniază imaginea pe orizontală.

Dacă valorile sunt date Stanga sau dreapta , imaginea va fi aliniată orizontal corespunzător, setarea acestor valori va asigura că textul se înfășoară în jurul imaginii

Să aruncăm o privire mai atentă la metodele absolute și relative de adresare a unui fișier.

Adresarea în formă absolută folosit când se face referire la resursele aflate pe alte servere. Se numește adresa universală care determină locația unei resurse informaționale URL(Uniform Resource Locator - adresa unificată a resursei). URL-ul este format din două părți, separate prin două puncte. Prima parte indică tipul de protocol de rețea, care depinde de tipul de resursă. De exemplu, dacă resursa este localizată pe un server WWW, acesta este protocolul http.A doua parte include numele computerului (server) în sistemul de nume de domeniu și (dacă este necesar) numele căii fișierului. Când scrieți un nume de cale, numele directoarelor sunt separate printr-o bară oblică (simbolul / ), în numele fișierelor și directoarelor diferențierea între litere mari și mici, spațiile nu sunt permise. Iată exemple de adrese URL:

http://www. vshu. kirov .ru/ site / imagini / poza 1. jpg

http://195.21.123.13:8110

ftp://everything.com/soft/prog.zip

mailto: Această adresă de e-mail este protejată de spamboți. Aveți nevoie de activarea JavaScript pentru ao vizualiza.

Ultima adresă URL care indică protocolul mailtoși adresa de e-mail nu are legătură către nicio resursă de informații; Acesta este singurul tip de adresă URL care nu include două bare oblice după două puncte.

Adresarea imaginilor în formă absolută nu este practic utilizată la crearea unui site web.

Adresarea în formă relativă utilizat atunci când se face referire la resurse situate pe același server. Când scrieți o cale de fișier, numele directoarelor sunt separate printr-o bară oblică (simbolul / ), deplasarea prin directoarele sistemului de fișiere cu un nivel în sus este indicată de două puncte (simboluri .. ). Pentru a fi mai clar, imaginați-vă un computer, de exemplu, cu următoarea structură de directoare care conține fișiere HTML:

FORMA\* MERGEFORMAT

Site-ul meu

Pa ges

Imagini

Pagina1.htm

Pagina2.htm

Pict1.jpg

Pict2.jpg

Index.htm

Imagine.jpg

În acest caz, de exemplu, sunt posibile următoarele opțiuni de înregistrare a etichetelor: IMG:

ü < IMG SRC = Picture . jpg >(Poza . jpg situat pe pagină Index. htm)

ü < IMG SRC = Images / Pict 1. jpg >(Imaginea 1 imagine. jpg situat pe pagină Index. htm)

ü < IMG SRC =../ Picture . jpg >(Poza . jpg situat pe pagină Pagina 1.htm)

ü < IMG SRC =../ Images / Pict 1. jpg >(Imaginea 1 imagine. jpg situat pe pagină Pagina 1.htm)

În ciuda faptului că în mod formal este necesar doar atributul SRC, în practică este, de asemenea, necesar să se specifice textul alternativ (atributul ALT), deoarece mulți oameni lucrează cu browserul în modul fără a încărca imagini.

Înălțimea și lățimea zonei în care este afișat desenul sunt specificate folosind atributele lățime și înălțime în pixeli sau ca procent din dimensiunea ecranului. Când se specifică unul dintre aceste atribute, desenul este scalat astfel încât înălțimea sau lățimea acestuia să se potrivească cu cea specificată. A doua dimensiune este setată automat, în proporția corespunzătoare. Aplicarea doar a unuia dintre atribute modifică ambele dimensiuni ale desenului.
Dacă setați în mod explicit ambele atribute, imaginea va fi scalată de-a lungul a două axe în conformitate cu dimensiunile specificate. Atributele înălțime și lățime nu modifică timpul de încărcare a imaginii, ci doar aspectul (dimensiunea) acesteia pe ecran.

Hiperlinkuri

Un hyperlink este un obiect (text, imagine, fragment de imagine) care, atunci când se face clic cu mouse-ul, duce la un nou document sau fragment de document. Sunt hyperlink-uri care vă permit să organizați tranzițiile între orice documente postate pe Internet.

Hiperlinkuri text

Conexiunea dintre documentele HTML și fragmentele de document este organizată folosind eticheta ... (din engleza Anchor - ancoră).

Eticheta este folosită atât pentru a crea o legătură către un alt document, cât și pentru a lega un fragment dintr-un document.

Atribut necesar:

HREF = url

Adresa documentului țintă (poate fi prezentată în formă absolută și relativă)

Atribute opționale de bază:

NAME=" Nume"

Marchează pe cel dintre< A > și A > fragment de document ca posibil obiect de legătură. Ca valoare de care ai nevoie alfabet latin scrieți orice cuvânt index unic pentru acest document. De exemplu, etichetați Sectiunea 1 creează un așa-numit marcaj (marcaj) pentru a merge la secțiunea 1 . În acest caz, vă puteți referi la zona marcată specificând pur și simplu numele acesteia după numele documentului (numele mărcii este precedat de un #).

Asa de, < AHREF="Index.html #partea 1">La secțiunea 1A>te va trimite la sectiunea " partea 1" din fișierul Index.html și
< AHREF="#partea 2"> La secțiunea 2A > − la secțiunea „parte”. 2" din actul curent, cu condiția ca documentul să aibă marca corespunzătoare

ȚINTĂ = " Nume"

Numele cadrului (cadrului) sau ferestrei pentru afișarea documentului țintă.

Acest atribut este utilizat numai împreună cu parametrul HREF. Valoarea trebuie să fie fie numele unuia dintre cadrele existente, fie unul dintre următoarele nume rezervate:

_de sine- indică faptul că documentul specificat în parametrul HREF ar trebui să fie afișat în cadrul curent;
_mamă- indică faptul că documentul ar trebui să fie afișat în cadrul părinte al cadrului curent (ocupă în întregime fereastra browserului);

_gol- specifică că documentul trebuie afișat într-o fereastră nouă

TITLE= " text!}"

Afișează un sfat explicativ când treceți mouse-ul peste un hyperlink

Textul și imaginile plasate între etichete devin zona activă a documentului, sensibile la un clic de mouse care determină încărcarea documentului țintă. Textul hyperlink este evidențiat cu subliniere și culori specificate ca valoare a atributelor LINK, UN LINK, V Etichetă LINK (sau culoarea implicită).

Hyperlinkuri-imagini

Pentru a face o imagine întreagă un hyperlink, puteți utiliza și eticheta ... ., numai în loc de text (sau împreună cu text) între < A>Și A>se află eticheta< IMG …> cu toate atributele corespunzătoare.

De exemplu , .

Harta hyperlink

Eticheta vă permite să faceți un fragment de text sau o imagine în zona activă în întregime; pentru acelasi lucru fragmente diferite Dacă aceeași imagine a fost legată de documente țintă diferite, va trebui să utilizați o etichetă care implementează imaginea hărții.

Singurul atribut obligatoriu al unei etichete de container este NUME, a cărui valoare va fi un nume (de exemplu, NAME=" harta mea", care trebuie folosit la descrierea atributului USEMAP Etichetă IMG care descrie imaginea destinată să servească drept hartă (cu un # atașat la numele hărții din stânga) USEMAP="# harta mea")

În interiorul containerului, fiecare zonă sensibilă la mouse a imaginii trebuie să aibă o etichetă cu următoarele atribute:

Sintaxa atributelor

Scop

COORDINE= listă

Listă de coordonate separate prin virgulă ale zonei active (în funcție de tipul formei zonei date)

HREF = url

FORMA = formă

Definește forma miezului. Valori posibile pentru acest atribut:

cerc(cerc – specificat de coordonatele centrului și razei în pixeli);

rect(dreptunghi - specificat de coordonatele colțurilor din stânga sus și din dreapta jos);

poli(poligon - definit de coordonatele vârfurilor sale)

În toate cazurile, coordonatele sunt măsurate din colțul din stânga sus al imaginii în pixeli, axa X este îndreptată spre dreapta, axa Y - jos.

NOREF

uneori este necesar să se indice că o zonă dată (specificată prin atributul SHAPE și coordonatele COORDS) nu este activă, nu există nicio reacție la un clic de mouse

Mese

Tabelele din documentele HTML sunt folosite nu atât pentru a plasa date în celule încadrate, ci pentru a aranja bucăți de text și imagini unul față de celălalt.

Tabelele în HTML sunt construite linie cu linie. Toate datele tabelare sunt incluse în etichete

; descrierea fiecărui rând de celule (rânduri) este conținută în etichete ... ; conținutul fiecărei celule este conținut în etichete ... (celule regulate) sau H>...H>(titluri) .

Astfel, pentru a descrie, de exemplu, un tabel cu două rânduri, fiecare conținând două celule, va trebui să creați următoarea construcție:

Celulele tabelului pot conține text, imagini, tabele imbricate etc. Nu trebuie să lăsați celulele tabelului necompletate; dacă vreo celulă ar părea goală, plasați un spațiu care nu se întrerupe în ea.

Textul plasat în celulele tabelului este plasat automat de browser în mod implicit; textul este afișat cuvânt cu cuvânt; Când se ajunge la marginea dreaptă a celulei, următorul cuvânt este mutat pe o nouă linie.

Celulele din tabel se pot întinde pe mai multe rânduri sau coloane; atunci când se descriu astfel de celule, atributele ROWSPAN (o celulă a cărei etichetă conține acest atribut este „întinsă” cu numărul specificat de rânduri) și COLSPAN (celula este „întinsă” cu mai multe coloane) sunt folosit. Iată un exemplu de organizare a unui tabel cu celule îmbinate:

< TR >

< TD ROWSPAN=2> 1-1 TD >

Etichetele care descriu tabele au un număr de atribute opționale.

Atributele etichetei specifică parametrii tabelului ca întreg:

Sintaxa atributelor

Scop

ALIGN = valoare

Alinierea în raport cu fluxul de text; valorile posibile sunt stânga, dreapta și centru

FUNDAL = url

Imagine de fundal pentru întregul tabel

BGCOLOR= culoare

Culoare de fundal

BORDERCOLOR = culoare

Culoarea chenarului

BORDERCOLORDARK = culoare

Colorează marginile din dreapta și de jos ale cadrului principal și marginile din stânga și de sus ale fiecărei celule cu culoarea specificată

BORDERCOLORLIGHT = culoare

Colorează marginile din stânga și de sus ale cadrului principal și, în consecință, marginile din dreapta și de jos ale fiecărei celule în culoarea specificată

CELLPADDING = valoare

Distanța de la marginile celulei la conținutul acesteia în pixeli

CELLSPACING = valoare

Distanța dintre celule în pixeli

HSPACE = sens

Spațiu liber la stânga și la dreapta tabelului în pixeli

VSPACE = sens

Spațiu liber deasupra și sub tabel în pixeli

LĂȚime = sens

Lățimea tabelului (setată în pixeli sau ca procent din lățimea curentă a ferestrei browserului)

Atributele etichetei specifică parametrii unei serii date (dacă apar contradicții, atributele specificate în etichetă sunt anulate).Alinierea conținutului celulei; valorile posibile sunt stânga, dreapta și centru

FUNDAL = url

Imagine de fundal pentru celulele unui rând de tabel dat

BGCOLOR= culoare

Culoarea de fundal pentru celulele din acest rând

BORDA = sens

Grosimea chenarului care înconjoară celulele acestui rând; BORDER=0 indică un chenar invizibil

VALIGN = sens

Alinierea verticală a conținutului celulei; valorile posibile sunt sus, centru și jos

Atributele etichetelor specifică parametrii unei celule date (dacă apar inconsecvențe, atributele specificate în și etichetele sunt anulate).

Sintaxa atributelor

Scop

ALIGN = sens

Aliniați conținutul celulei; valorile posibile sunt stânga, dreapta și centru

FUNDAL = ur l

Imagine de fundal pentru celula tabelului

BGCOLOR= culoare

Culoarea de fundal pentru celulă

BORDA = sens

Grosimea cadrului din jurul celulei

VALIGN = sens

Alinierea verticală a conținutului celulei; valorile posibile sunt sus, centru și jos

LĂȚime = sens

Lățimea celulei în pixeli sau procent din lățimea tabelului

ROWSPAN= sens

Indică numărul de rânduri acoperite de o celulă

COLSPAN = sens

Specifică numărul de coloane acoperite de o celulă

Când lucrați cu tabele, rețineți că valoarea specificată pentru atributul WIDTH este în multe cazuri doar „notată” de browser. Proporțiile date sunt rareori menținute exact; browserul încearcă să afișeze tabelul cât mai bine posibil (în înțelegerea lui).

Ticker

Utilizarea unui ticker pe o pagină web o face mai dinamică și vă permite să creați efectul mișcării unui obiect. Crearea unui ticker folosind o etichetă< MARQUEE> … MARQUEE>.

Între< MARQUEE> și MARQUEE> fragmentele de text și imaginile pot fi localizate. Textul poate fi formatat folosind etichete adecvate, iar graficele sunt inserate folosind .

Sintaxa atributelor

Scop

BGCOLOR=culoare

Culoare de fundal. Dacă este specificat fundalul, browserul desenează o dungă colorată pe ecran de-a lungul căreia se mișcă textul sau imaginea.

ÎNĂLŢIME=sens

Înălțimea barei de fundal. Valoarea este specificată în pixeli sau ca procent din înălțimea ferestrei browserului.

De exemplu, dacă specificați atributul HEIGHT=25%, bara de ticker va ocupa un sfert din înălțimea ferestrei

LĂȚime =sens

Lățimea barei de ticker, indicată în pixeli sau ca procent din lățimea ferestrei browserului

DIRECȚIE=sens

Direcția de mișcare a liniei:stânga − stânga (implicit),dreapta - La dreapta,sus - sus,jos − jos

COMPORTAMENT=sens

Atributul controlează comportamentul tickerului:

sul (implicit) - după ce a ajuns la marginea ferestrei, linia părăsește câmpul vizual și apoi apare pe partea opusă;

diapozitiv − linia apare de la marginea ferestrei, ajunge pe cea opusă și se oprește;

alterna − linia se deplasează la dreapta sau la stânga, „reflectându-se” de la marginile ferestrei și schimbând direcția de mișcare

HSPACE = offset de pixeli

Deplasați bara de ticker orizontal spre dreapta

VSPACE = Tu coT Aîn pixeli

Crearea unui spațiu gol deasupra și dedesubtul benzii

BUCLĂ=sens

Numărul de tranziții de linii pe ecran

SCROOLAMONT= sens

Numărul de pixeli pe care linia parcurge fiecare pas. Modul implicit este de aproximativ 10 px/pas. Acest atribut vă permite să reglați viteza de mișcare a liniei

SCROLLDELAY =sens

Definește intervalul de timp (în milisecunde) dintre pași, folosind acest atribut puteți face ca linia să se miște sacadat

TRUESPED

Când acest flag (un atribut fără valoare) este setat, se va folosi valoarea SCROLLDELAY specificată. Dacă indicatorul nu este setat, valoarea este SCROLLDELAY<= 59 будет округлено до 60

Linie orizontală

Linia orizontală este specificată de etichetă R> și nu necesită o etichetă de închidere. În mod implicit, linia este desenată pe toată lățimea paginii și arată cam așa:

Specifică lungimea liniei în pixeli sau procentul din lățimea ferestrei browserului

MĂRIMEA= sens

Specifică grosimea liniei în pixeli

ALINIA= sens

Determină alinierea liniei orizontale. Parametrul poate lua următoarele valori:

stânga - pe marginea stângă,

dreapta - pe marginea dreapta,

centru - centrat (utilizat implicit)

NOSHADE

Determină modul în care linia va fi umplută ca solidă. Parametrul este un flag și nu necesită o valoare. Fără acest parametru, linia este afișată ca tridimensional

CULOARE= culoare

Definește culoarea liniei (validă numai înInternetExplorator)

Nu vom intra în detalii și în istoria a ceea ce este HTML, ci vom trece imediat la punctele principale. HTML este baza pentru construirea oricărui site web! Când studiați subiectul construirii site-ului web, trebuie să începeți cu el. Nu e nimic greu aici. ABSOLUT TOată lumea poate stăpâni această tehnologie!

Aș dori să notez imediat că acesta NU este un limbaj de programare, ci un limbaj de marcare.

De ce este ușor să înveți HTML?

Pentru a vorbi fluent engleza, nu trebuie să cunoașteți toate cuvintele în limba engleză. Deci, aici, trebuie doar să înveți câteva dintre etichetele de bază și să înveți cum să lucrezi cu ele. Și apoi tot ce trebuie să faci este să exersezi și să dezvolți abilitățile.

Să începem să studiem această tehnologie fascinantă și, în același timp, simplă.

Puțină teorie...

Orice pagină este formată din etichete. Adică, pagina nu arată de fapt ca ceea ce suntem obișnuiți să vedem, ci constă din multe etichete, fiecare dintre acestea având un rol specific.

Este ca un zid mare făcut din cărămizi. Dacă toate cărămizile de pe el sunt așezate cu grijă, atunci întregul perete arată frumos. Prin urmare, atunci când scrieți structura paginii, este necesar să acordăm atenție fiecărei etichete, deoarece este „blocul” pentru viitoarea noastră pagină.

Dar ce este o etichetă în HMTL?

Acesta este un element de pagină HTML care afectează cumva afișarea și aspectul paginii. Este destul de dificil să înțelegeți acest lucru în cuvinte, așa că trebuie să vă uitați imediat la totul în practică și să vă obișnuiți cu codul. Uită-te la imaginea de mai jos:

Aceasta este structura celei mai simple pagini. Dar aceste cuvinte repetate între paranteze triunghiulare sunt etichete. Dacă deschideți editorul de text și scrieți acest cod, apoi îl salvați în format HTML, veți obține o pagină HTML. Nu este încă clar ce este HTML? 🙂

Din această structură puteți vedea acele etichete care trebuie să fie prezente. Acestea sunt etichetele:

  • si inchidere
  • si inchidere
  • si inchidere

Pentru a fi mai clar, le-am evidențiat cu portocaliu în imaginea de mai jos:

Tot ce vom scrie între etichete Și nu vom vedea pe pagina noastra. Aceste etichete pot spune browserului despre codificare, despre titlul paginii noastre, diferite stiluri, scripturi și așa mai departe pot fi conectate aici. Toate acestea le vei vedea în lecțiile ulterioare.

Și iată toate etichetele pe care le vom scrie între etichete Și

, în funcție de scopul său, va afecta structura paginii noastre HTML.

Ei bine, a devenit mai clar ce este HTML? 😉 Dar nu ne oprim și mergem mai departe...

Unele etichete pot avea o etichetă de închidere, iar altele nu. De exemplu, eticheta există o etichetă de închidere

. După cum probabil ați ghicit deja, etichetele sunt închise folosind o bară oblică.

Este foarte important să respectați etichetele de deschidere și de închidere. Ca să nu existe greșeli. Este posibil ca browserul să nu arate eroarea, dar structura paginilor dvs. va fi incorectă și vor exista probleme mari atunci când lucrați în continuare cu stiluri (unde ne vom ocupa de aspect). Prin urmare, dacă o etichetă are o etichetă de închidere, aceasta trebuie să fie prezentă în locul corect.

Să ne uităm la un exemplu despre cum să NU închideți etichetele și în ce ordine ar trebui făcut. Exemplu de două etichete:

COD HTML corect

Ceea ce vezi mai sus este aceasta este ordinea corectă de scriere a etichetelor de închidere. Dar poate exista o astfel de situație

EROARE ÎN CODUL HTML

Etichete atât de apropiate este strict interzis!

Exersați pentru a înțelege ce este HTML...

Puteți afla mai multe despre ce este HTML doar prin practică. Puteți utiliza orice editor de text pentru aceasta. Chiar și un blocnotes. Dar recomand să folosești Notepad++, deoarece există mult mai multe funcții pentru lucrul cu HTML. Îl puteți descărca de la linkul Descărcare Notepad++. Acest editor are toate capabilitățile de a crea și edita pagini HTML.

Sa incepem. După deschiderea programului, veți vedea următoarea fereastră:

Pentru a crea o pagină HTML, trebuie să introduceți „corpul” paginii în această casetă. Puteți copia textul de mai jos și pur și simplu îl puteți lipi. Dar este mai bine să introduceți totul manual. În acest fel, vă puteți aminti rapid și vă puteți obișnui cu etichetele.

Deci, ar trebui să obțineți următoarele:

Apoi, trebuie să salvați această pagină în format HTML. Pentru a face acest lucru, faceți clic pe meniul „Fișier”, apoi faceți clic pe „Salvare ca...”. Introduceți numele paginii HTML. L-am numit index.html. Apoi pur și simplu îl salvăm într-un loc convenabil pe computerul nostru. După aceasta, etichetele HTML vor fi evidențiate, deoarece editorul Notepad++ va înțelege că acesta este un document HTML. Și este mult mai plăcut să lucrezi cu iluminare de fundal.