Această secțiune a site-ului este dedicată în întregime două limbi pentru crearea unui site, și anume HTML și CSS. Aici puteți învăța limbi străine pas cu pas, puteți învăța totul, de la elementele de bază până la cele mai dificile momente.

Această secțiune este construită pe principiul studiului pas cu pas al materialului, prin urmare, înainte de fiecare titlu al unei lecții despre HTML și CSS, există un număr corespunzător numărului de serie al lecției. Acest lucru este firesc dacă vrei să înveți totul de la elementele de bază și să nu faci mizerie în capul tău. Dacă știți deja ceva despre limbajele HTML și CSS, atunci puteți găsi și aici cunoștințele care vă lipsesc sau să aprofundați ceea ce ați învățat deja.

ÎN aceasta sectiune Au fost postate lecții despre standardele de limbaj HTML5 și, respectiv, CSS3, dacă există versiuni mai noi ale acestor limbi, acestea vor fi reflectate și în noile lecții din această secțiune și veți afla cu siguranță.

Probabil că fiecare persoană care s-a confruntat cu crearea unui site web cel puțin o dată în viață a auzit cu siguranță despre o astfel de combinație precum html și css, pot spune cu încredere că dacă vrei să faci singur site-uri, atunci nu te poți lipsi de cunoștințele acestora. două lucruri.

După ce ai primit concepte generale Există în mod clar o imagine ambiguă în capul tău despre ce este html și cred că acest lucru nu este surprinzător. Este timpul să treceți direct la exersare și să creați primul dvs. document HTML.

Ca și limbajul html, CSS are propriile caracteristici, reguli și structură. În această lecție vă voi spune despre conceptele de bază Limbajul CSS, despre structura sa, dispozitiv, iar pe primul îl vom face cu tine Tabel CSS stiluri și învățați cum să conectați o foaie de stil la un document html.

Selectorii din CSS sunt baza limbajului în sine, iar învățarea și înțelegerea lor este foarte importantă, așa că în această lecție vă voi spune despre mai multe tipuri de selectoare și vă voi descrie capacitățile acestora.

Un punct foarte important în crearea unui site web este lucrul cu text și, după cum înțelegeți, trebuie să puteți lucra cu text în html și să știți ce etichete există și cum pot fi utilizate.

După ce ați învățat toate etichetele HTML pentru lucrul cu text, acum este timpul să treceți direct la CSS care lucrează cu text, ceea ce vă va extinde semnificativ cunoștințele și capacitățile.

CSS conține un număr mare de tot felul de convenabile și schimbătoare calitativ aspect proprietăți și continuăm să studiem Funcționează CSS cu text și în această lecție, vom aprofunda subiectul lucrului cu text și vom analiza noile proprietăți ale textului.

Lucrul cu imagini la crearea de pe un site web, unul dintre puncte cheie, atât atunci când creați un design, cât și atunci când pur și simplu așezați sau scrieți orice materiale pentru site-ul dvs.

CSS extinde foarte mult capacitatea de a lucra cu oricare obiecte html, în această lecție aș vrea să vă povestesc în detaliu despre parametrii care pot fi aplicați imaginilor.

Acum este greu de imaginat o persoană care lucrează cu Internetul și nu știe ce este html. Mulți oameni doresc să învețe această limbă. S-ar părea că nimic nu poate fi mai simplu - există un număr înfricoșător de mare de cărți dedicate acestui subiect. Este limbajul html într-adevăr atât de complex încât îi sunt dedicate volume uriașe?

În acest articol vreau să încerc să ofer cunoștințe de bază despre subiect acelor oameni care doresc să învețe layout-ul, să-i îndrepte în direcția corectă. Asta nu înseamnă că ceea ce am scris este un adevăr imuabil. Vreau doar ca începătorii să aibă o mică perspectivă asupra problemelor generale.

Pentru început, aș vrea să aduc plan brut Acest articol. Dacă cineva nu este interesat de ceva, îl poate sări în siguranță.

• Ce etichete trebuie să știți?
• Cum să-l faci frumos?

Ce este html și de ce este necesar?

html nu este un limbaj de programare, așa cum cred mulți oameni. Este doar un limbaj de marcare. Scopul său este de a determina structura documentului. Dacă cineva vă spune că este nevoie de html pentru a determina aspectul paginii, nu-l crede! Această persoană fie este din trecut, fie nu înțelege pe deplin subiectul.

html definește aranjarea semantică (semnificativă) a elementelor. Care paragraf urmează pe care, ce conținut este conectat logic și care reprezintă seturi complet diferite de date, unde să inserez o imagine și unde să mergeți făcând clic pe acest link. În principiu, dacă acum s-ar folosi doar html pentru aspectul paginii, toate site-urile cu greu ar fi foarte diferite ca aspect. Dacă cineva spune că instalarea imagine de fundal- sarcină html - scuipă-i în față nu-l crede.

HTML, ca multe alte tehnologii legate de web, este acceptat de consorțiul W3C. Dacă doriți să aflați totul la prima mână, vă rugăm să vizitați site-ul lor. Dar trebuie să vă avertizez: specificațiile emise de W3C sunt de natură consultativă, astfel încât browserele interpretează întotdeauna același lucru diferit. cod html. Acest lucru face ca aspectul să pară mult mai complicat decât este de fapt.

În prezent, cea mai recentă specificație html este 4.0. Există, de asemenea, limba xhtml, care este mult mai solicitant pentru dezvoltator deoarece conține standarde mai stricte. Deci, etichetele în html pot fi scrise în orice caz, dar în xhtml - doar cu litere mici. Și așa mai departe. Mă țin de specificația xhtml și o voi descrie mai jos.

Limbajul HTML constă dintr-un set de etichete. Acestea sunt directive pentru browser care îi indică structura documentului dumneavoastră. Vă rugăm să rețineți: structură. Astăzi, o altă tehnologie este responsabilă de aspect - CSS, despre care vom discuta mai jos. Pentru a învăța html, de fapt, trebuie să înveți un set de etichete și atributele acestora și atât! Puteți începe să creați site-uri de testare.

Ce etichete trebuie să știți?

Pentru a începe, trebuie să înveți un mic set de etichete. Acum le voi enumera, grupându-le după anumite criterii. (Gruparea este viziunea mea subiectivă asupra subiectului și nu pretinde a fi absolut adevărată)

• De bază: html, head, title, body;
• Structural: div, span;
• Text: p, ul, ol, li, h1-h6, br, pre;
• Tabele: table, tr, td;
• Link-uri: a;
• Multimedia: img, obiect;
• Frames: frameset, frame, iframe;
• Formulare: formular, intrare, textarea, etichetă, selectare, opțiune;
• Opțional: hr;
• Special: script, link, meta;

După cum puteți vedea, nu există atât de multe etichete. Cu toate acestea, învățarea lor poate dura o perioadă semnificativă de timp, deoarece multe dintre aceste etichete pot avea atribute care fac ca elementele să se comporte diferit.

Cineva poate fi indignat și spune că cunoaște alte etichete care funcționează. Da, într-adevăr, nu am enumerat toate etichetele acceptate de browsere. Cu toate acestea, aceste etichete sunt de bază, iar o persoană care le cunoaște poate spune că știe html. În mod deliberat, nu am inclus etichete precum fontul în lista mea, care sunt învechite. Aceste etichete sunt atât de rele încât nu are sens să vorbim despre ele, deoarece acum există instrumente mult mai puternice care vă permit să controlați aspectul paginilor și părților lor. Personal, consider că cunoașterea etichetelor de mai sus este necesară și suficientă. Pentru că restul fie sunt necesare foarte rar, fie deloc. Prin urmare, vă sugerez să începeți să studiați html studiind aceste etichete.

Cum să-l faci frumos?

Oricine încearcă să creeze o pagină folosind etichetele de mai sus va ajunge la o pagină destul de modestă, care va fi albă, cu text negru și link-uri albastre. Unii oameni pot fi capabili să diversifice poziționarea blocurilor de informații folosind tabele și să alinieze atribute. Cineva va încerca să însuflețeze pagina inserând imagini. Cu toate acestea, există remediu special pentru a personaliza aspectul paginilor. Acesta este CSS.

În zilele noastre, aproape niciun site web nu se poate descurca fără utilizarea Tehnologii CSS. Este CSS căruia i se încredințează misiunea de a determina designul unui document. Fundalul paginii, umplutura, alinierea, fonturile, culorile și multe altele sunt responsabilitatea CSS. Prin urmare, acum este recomandat să nu folosiți etichete și atribute care determină designul paginilor și elementelor, ci să folosiți în schimb reguli CSS. Despre modul de utilizare CSS este mai bun citit in carti. Dar vreau să spun că dacă dai peste o etichetă sau un atribut care determină aspectul unui element, gândește-te de 10 ori înainte de a-l folosi! Este mai bine să aflați ce regulă CSS este responsabilă pentru afișarea elementului așa cum doriți să fie văzut. Cu excepții foarte rare, o astfel de regulă este întotdeauna găsită.

Unde este cel mai bun loc pentru a începe să învețe aspectul?

Cel mai bine este să începeți să creați machete după ce înțelegeți principiile modului în care funcționează web-ul. Personal, as face un plan de antrenament ca acesta:

1. Învățarea principiilor munca webși structuri client-server
2. Studiul etichetelor și al atributelor acestora, cu exercitii practice la cererea lor
3. Învață regulile CSS cu exerciții practice despre cum să le aplici
4. Studierea aspectului mesei
5. Aspectul unui aspect simplu cu tabele
6. Aspectul unui aspect complex cu tabele
7. Explorarea directivelor DOCTYPE
8. Studiu aspectul blocului(etichetă div)
9. Aspectul unui aspect simplu folosind dive
10. Aspectul unui aspect complex folosind dive
11. Trucuri, trucuri, hack-uri și alte înțelepciuni de la guru

În principiu, pentru un nivel inițial de pregătire și cunoaștere a elementelor de bază ale HTML, este suficient să treci doar prin primele 5 puncte. (această opțiune va fi ideală pentru programatorii web care nu vor proiecta site-uri web. Cunoașterea html trebuie doar să scoată datele obținute ca urmare a executării scriptului.)

Am vrut odată să fac primul meu site web cu tematică IT. Din această zonă știam doar elemente de bază foarte simple ale HTML și poate asta e tot. Dar aveam dorință și curaj mai mult decât suficient, așa că fără prea mare teamă mi-am înregistrat primul nume de domeniu.

Călătoria mea în stăpânirea CSS și HTML a fost lungă, aproximativ 2,5 ani și cred că procesul de auto-învățare nu se va termina niciodată. Dar îmi amintesc acum că îmi doream foarte mult să găsesc un punct de sprijin din care să încep să stăpânesc această nouă zonă pentru mine, deoarece multe informații au venit deodată și nu a fost ușor să le diger.

Plin de hotărâre, mi-am înregistrat primul domeniu și am început să-mi ating obiectivele. În acel moment, știam că majoritatea site-urilor care sunt pe Internet funcționează pe diverse sisteme de management al materialelor gata făcute, adică CMS. Și prima mea sarcină a fost să găsesc un CMS.

Atunci când am ales un CMS, am acordat atenție unui singur lucru - CMS-ul nu ar trebui să fie pretențios cu resursele serverului, deoarece dorința probabil a oricărui începător în acest domeniu este de a minimiza toate costurile. Ei bine, este clar că CMS-ul ar trebui să fie bazat pe blog.

După ce am rătăcit mult pe web, am dat peste CMS Textpattern. După 2,5 ani, pot spune cu încredere că am luat decizia corectă atunci când am ales Textpattern. Acesta este cel mai mult cel mai bun CMS pentru blog, care este în public.

Cu performanțe extraordinare, acest CMS poate fi găzduit pe aproape orice găzduire care are suport MySQL și PHP. În acest moment, folosesc găzduire ieftină, nu VPS, și găzduiesc 16 site-uri pe el. Vizita zilnică la toate site-urile este de aproximativ 5.000 de vizitatori unici pe zi. Cred că acesta este un bun indicator al performanței Textpattern.

Principala problemă pe care am întâlnit-o după instalarea acestui CMS a fost ignoranța mea absolută cu privire la elementele de bază ale CSS. Am extras informații puțin câte puțin din comunitatea vorbitoare de limbă rusă până când în cele din urmă am dat peste site-ul http://htmlbook.ru. Înainte de această descoperire, mă gândeam să cumpăr o carte despre CSS, dar acum mă bucur chiar că nu am avut timp să fac asta, deoarece ar fi fost o altă achiziție a unui nou colector de praf.

Pe site HTMLbook Am găsit o mulțime de informații bine structurate. Pentru un începător, aceasta este doar o comoară. Chiar și acum apelez adesea la această resursă, deoarece este imposibil să-mi amintesc totul și nu este nevoie de ea. Cunoașterea principală a unei persoane este să știe de unde să obții ceea ce ai nevoie!

Dacă sunteți abia la începutul vieții profesionale și plănuiți să stăpâniți CSS și HTML, atunci sfatul meu pentru dvs. este: nu cumpărați cărți de hârtie care devin depășite înainte de a fi publicate, ci folosiți servicii WEB care nu numai că vor economisi bani, dar va fi un ajutor excelent mereu la îndemână.

P.S. Sunt întotdeauna uimit când dau peste vreun „blog pentru bani începători” sau, așa cum este acum la modă, o „persoană fără adăpost” care încearcă să câștige mulți bani, dar habar nu are cum să o facă singur. design unic pentru site-ul tău și se dovedește că există o grămadă de oameni fără adăpost asemănători între ei. Desigur, poți plăti pentru design, dar un ban economisește o rublă și nimeni nu o poate face mai bine decât tine însuți.

Am decis să acord mai multă atenție începătorilor care doresc să dobândească cunoștințe în domeniul construirii site-urilor web. Profesorul meu m-a împins să fac asta, pentru că a făcut multe greșeli în manualele de instruire. munca de laborator. Aș fi bucuros să mă uit la resursa din care au fost preluate informațiile educaționale și să las acolo câteva rânduri din opinia mea. Dar acum nu este vorba despre asta. În prima mea prelegere voi vorbi despre

Care este structura unui document HTML?

Etichetă anunță că începe structura documentului html, - care se termină. Între etichete Majoritatea informațiilor sunt stocate pentru browser și motoarele de căutare. În etichete conține titlul paginii noastre. Etichetă indică faptul că ceea ce urmează sunt informații destinate utilizatorului, Acest lucru înseamnă în mod natural că informațiile pentru utilizator se epuizează.

Acum am sa explic putin. Toate etichetele ( tag - element de limbaj de marcare hipertext) sunt împărțite în două tipuri: „singur” și „închidere”. În plus, etichetele sunt incluse în următoarele caractere < Și > , ei sunt cei care disting eticheta din text simplu html. Să ne uităm la câteva dintre cele mai simple etichete „single”:

— o etichetă care este responsabilă pentru trecerea la o nouă linie în locul în care este instalată această etichetă. Să ne uităm la codul folosind această etichetă.

Salutare tuturor!
Și acesta este primul meu site.

Rezultatul poate fi vizualizat.

• align — Determină alinierea liniei. Poate lua valoarea stânga, centru, dreapta.
• culoare — Setează culoarea liniei.
• noshade - Desenează o linie fără efecte 3D.
• dimensiune — Setează grosimea liniei.
• width — Setează lățimea liniei.

Codați folosind eticheta

Salutare tuturor!

Un exemplu vizual poate fi găsit aici.

O altă etichetă „unică” este . Această etichetă sunt folosite pentru a stoca informații destinate browserelor și motoarelor de căutare. Motoarele de căutare caută meta-etichete pentru a obține descrieri ale site-urilor, cuvinte cheie și alte date. Aveți voie să utilizați un număr nelimitat de meta-etichete, toate trebuie să fie situate între Și . Parametrii oricărei metaetichete au forma „nume=valoare”, care este determinată Cuvinte cheie conţinut, Nume sau http-echiv. Deoarece meta tag-urile sunt destinate mașinilor, nu fac nicio modificare vizuală, așa că voi da doar sursă:

Această linie indică faptul că creatorul paginii consideră că pagina utilizează codificarea UTF-8. În HTML5 totul a devenit mai simplu pentru a specifica codificarea, tot ce aveți nevoie este următoarea linie:

Mai sunt și altele etichete unice (, ,
, , , ,

Acum să vorbim despre etichetele de „închidere”. Însuși numele „etichetă de închidere” indică faptul că eticheta necesită o închidere obligatorie. Acest lucru se face pentru a limita clar partea de text pe care o afectează eticheta.

Pentru un exemplu clar, să ne uităm la etichetă , care este folosit pentru a evidenția textul, setează fontul la aldine. Etichete Și sunt limite care definesc zona de selecție a textului. Iată codul în care au uitat să închidă eticheta din ultima linie :

Salutare tuturor!Și acesta este primul meu site.
Salutare tuturor! Și acesta este primul meu site.

După cum puteți vedea, nu este nimic complicat, acum puteți crea mai multe pagini legate între ele.

Vă permite să ocoliți această funcție și să afișați text așa cum este cerut de dezvoltator.

— definește un paragraf de text.  Etichetă 
Este un element bloc, începe întotdeauna pe o linie nouă, paragrafele de text care se succed sunt separate prin padding.  Cantitatea de umplutură poate fi controlată folosind stiluri.  Dacă nu există etichetă de închidere, se presupune că sfârșitul paragrafului coincide cu începutul următorului element de bloc.
..
..

- HTML oferă șase titluri la diferite niveluri, care indică importanța relativă a secțiunii de după titlu.  Da, etichetă 
reprezintă cel mai important titlu de prim nivel și eticheta 
servește la indicarea titlului de nivelul șase și este cel mai puțin semnificativ.  În mod implicit, titlul de la primul nivel este afișat cu cel mai mare font aldine, iar titlurile de nivel ulterioare sunt mai mici.  Etichete 
,…,
Faceți referire la elementele bloc, ele încep întotdeauna pe o linie nouă, iar după ele, alte elemente apar pe linia următoare.  În plus, spațiul alb este adăugat înainte și după titlu.  Eticheta are un atribut alinia, care definește alinierea titlului, poate lua valorile stânga— alinierea antetului la stânga, centru- alinierea la centru, dreapta- alinierea la dreapta, justifica— alinierea după lățime (simultan de-a lungul marginilor din dreapta și din stânga).  Această valoare funcționează numai pentru anteturile care sunt mai lungi de o linie.


— este un container pentru modificarea caracteristicilor fontului, cum ar fi dimensiunea, culoarea și fontul.  Deși această etichetă este încă acceptată de toate browserele, este considerată învechită și se recomandă renunțarea la utilizarea sa în favoarea stilurilor.  Eticheta are 3 atribute: culoare— setează culoarea textului, față— definește caracterul fontului, mărimea— setează dimensiunea fontului în unități convenționale.

— marchează textul ca citat sau notă de subsol pentru alt material.  Această evidențiere este utilă pentru schimbarea stilului textului prin CSS și este, de asemenea, folosită pentru a separa codul HTML în elemente structurale.  Browserele setează de obicei textul în interiorul containerului cu caractere inclinate.

— indică faptul că secvența de caractere este o abreviere.  Folosind atributul titlu se oferă o decodare a abrevierii, care permite acelor persoane care nu sunt familiarizate cu ea să înțeleagă abrevierea.  În plus, motoarele de căutare indexează versiunea full-text a abrevierei, care poate fi folosită pentru a îmbunătăți clasarea documentului.
În mod implicit, textul este inclus într-un container subliniat de o linie punctată.
Mai jos este codul în care am folosit toate aceste etichete:

 




HTMLși CSS sunt două dintre tehnologiile de bază pentru construirea de pagini Web.  HTML oferă structura paginii, CSS aspectul (vizual și sonor), pentru o varietate de dispozitive.  Alături de grafică și scripting, HTML și CSS sunt baza construirii paginilor web și aplicațiilor web.  Aflați mai multe mai jos despre:
Ce este HTML?
 HTML este limbajul de descriere a structurii paginilor Web.  HTML le oferă autorilor mijloacele de a:

Publicați documente online cu titluri, text, tabele, liste, fotografii etc. 
Preluați informații online prin link-uri hipertext, cu un clic pe un buton. 
Proiectați formulare pentru efectuarea tranzacțiilor cu servicii la distanță, pentru utilizare în căutarea de informații, efectuarea rezervărilor, comandarea produselor etc. 
Includeți foi de calcul, clipuri video, clipuri audio și alte aplicații direct în documentele lor. 

 Cu HTML, autorii descriu structura paginilor folosind markup.  Elementele limbii etichetează piese de conținut, cum ar fi „paragraf”, „listă”, „tabel” și așa mai departe.
Ce este XHTML?
XHTML este un varianta HTML care utilizează sintaxa XML, Extensible Markup Language.  XHTML are toate aceleași elemente (pentru paragrafe etc.) ca și varianta HTML, dar sintaxa este ușor diferită.  Deoarece XHTML este o aplicație XML, puteți utiliza alte XML unelte cu acesta (cum ar fi XSLT, un limbaj pentru transformarea conținutului XML).
Ce este CSS?
CSS este limbajul pentru descrierea prezentării paginilor Web, inclusiv culorile, aspectul și fonturile.  Permite adaptarea prezentării la diferite tipuri de dispozitive, cum ar fi ecrane mari, ecrane mici sau imprimante. CSS este independent de HTML și poate fi folosit cu orice marcare bazată pe XML limba limba.  Separarea HTML de CSS facilitează întreținerea site-urilor, partajarea foilor de stil între pagini și adaptarea paginilor la diferite medii.  Aceasta este denumită separarea structurii (sau: conținutului) de prezentare.
Ce este WebFonts?
Fonturi web este o tehnologie care permite oamenilor să utilizeze fonturi la cerere pe Web fără a necesita instalare în sistemul de operare.  W3C are experiență în fonturi descărcabile prin intermediul HTML, CSS2 și SVG.  Până de curând, fonturile descărcabile nu erau comune pe Web din cauza lipsei unui format de font interoperabil.  Efortul WebFonts intenționează să rezolve acest lucru prin crearea unui format de font deschis, susținut de industrie pentru Web (numit „WOFF”).


Prelegerea s-a încheiat, sper că cunoștințele dobândite vă vor fi de folos!  În următoarea prelegere vă voi spune ce stochează eticheta în sine , vom învăța cum să efectuăm tot felul de manipulări cu imagini și să ne familiarizăm cu tabelele.
La scrierea acestui articol, descrierea unor etichete a fost preluată de aici
Cu această serie vreau să deschid o serie de lecții dedicate HTML.  Am luat această decizie pentru că aș dori să încerc să învăț utilizatorii cum să creeze site-uri web de la zero.  Acest gând este în capul meu de ceva vreme.  Singura întrebare care a apărut a fost de unde să începeți, cu HTML sau să treceți direct la instalarea motorului și configurarea lui în continuare.
Dar dacă începeți prin a învăța motorul, atunci unii dintre utilizatorii care nu cunosc HTML vor fi lăsați afară.  Așa că am decis să încep cu elementele de bază și să o fac în așa fel încât chiar și orice începător să-și dea seama ce și cum.
Deci, ce este HTML?
Abrevierea în sine reprezintă N ureg T ext M arkip L apguage ( limbaj de marcare hipertext).
Și pentru a spune simplu, atunci HTML este un limbaj special de marcare care spune browserului cum să afișeze asta sau asta pagină web.  Adică, în ce font trebuie afișat textul, în ce ordine trebuie aranjate elementele, ce elemente trebuie afișate subliniate etc. Și în funcție de ce element întâlnește browserul, în conformitate cu regulile stabilite în browserul însuși , acest element va apărea astfel afișat.  Cu toate acestea, aceste reguli pot fi apoi modificate, dar despre asta voi vorbi deja în următoarele lecții, care vor fi dedicate CSS.
Propun să începem prin a privi un exemplu de pagină web simplă, care poate fi.  Acum nu ar trebui să vă concentrați atenția asupra a ceea ce înseamnă asta sau asta. Etichete.  Există un timp pentru orice, pentru început, trebuie doar să acordați atenție unde este totul în cod și cum se leagă totul de ceea ce este afișat în browser.  Luați în considerare un exemplu de document HTML:

 
 
 
 
 
 
O zi din viața mea
 
Pregătirea pentru concert
 
Astăzi m-am trezit devreme pentru că aveam o zi grea înainte.  Până la urmă, astăzi trebuie să cânt la un concert în fața a o sută de spectatori.  Și ca să mă asigur că totul merge bine, trebuie să repet programul de repetiții
 
Repetiţie
 
Totul a mers fără probleme.  Nimeni din echipa noastră nu a pierdut ritmul și, după cum s-a dovedit, toată lumea s-a îngrijorat în zadar.
 
Concert
 
Toată lumea a evoluat bine, deși cred că a fost un moment în care bateristul nostru și-a pierdut tempo-ul.  Dar am ieșit inteligent din situație.
 

În primul rând, va trebui să tastați acest text într-un editor de text (cred că cel mai convenabil este Notepad++) și salvați fișierul sub numele index .html undeva pe disc.  Când faceți dublu clic pe fișierul salvat, veți vedea o pagină care arată cam așa.
Vă rugăm să rețineți că etichetele în sine nu sunt afișate, dar conținutul însuși care se află între ele este afișat.  Și de aici puteți concluziona că etichetele acționează ca un element de design în HTML.
Uită-te la codul sursă.  După cum probabil ați observat deja, există o mică liniuță înaintea cuvântului „Unul”.  Cu toate acestea, browserul nu a ținut cont de el, pur și simplu l-a înghițit în tăcere, de parcă n-ar fi existat niciodată.  Mai mult, dacă încercați să puneți mai multe spații între cuvinte, toate vor fi percepute de browser ca un singur spațiu - HTML are această caracteristică.
Și iată un alt sfat: atunci când scrieți cod HTML, antrenați-vă să indentați acele etichete care sunt imbricate în altele.  De exemplu, etichetele title și body sunt imbricate în eticheta html.  Aceasta înseamnă că atunci când scrieți aceste etichete, nu uitați să le indentați corespunzător.  De obicei, acestea se fac folosind două spații sau file - aceasta este o chestiune de gust.  De ce este necesar acest lucru?  Acum, în acea mică bucată din document pe care am dat-o ca exemplu mai sus, nu există prea multe informații, așa că este destul de problematic să te confuzi acolo.  Cu toate acestea, dacă există multe elemente imbricate pe pagină, atunci nimic nu va fi mai ușor decât să te pierzi în acest cod uriaș și să ai dificultăți în a-ți da seama în ce parte a documentului te afli acum.  Așa că este mai bine să te obișnuiești imediat cu un stil bun, atunci îl vei înțelege singur și îți va fi de folos în viitor.
De asemenea, merită să indicați minimul strict de etichete care ar trebui să fie în documentul HTML.  Eu vorbesc despre aceasta parte:

 
 
 
 
 
 

Dar chiar dacă această parte lipsește, majoritatea browserelor vor închide ochii la toate acestea și vor afișa în continuare pagina dvs.  Cu toate acestea, un astfel de stil de codare frivol, în care o persoană sare peste un număr mare de etichete, este o scriere proastă, așa că este indicat să aveți toate aceste elemente pe pagina dvs. în orice caz.  În caz contrar, acest lucru poate pune o problemă de compatibilitate cu alte browsere, care ar putea afecta în cele din urmă aspectul site-ului dvs. și, ca urmare, traficul.
În plus, puteți scrie comentarii într-un document HTML - acestea sunt doar informații de serviciu care vă sunt destinate exclusiv.  De obicei, acestea sunt câteva note importante care vă servesc drept reamintire sau doar ceva la care merită să fiți atenți.  Comentariile nu sunt procesate de browser, ceea ce înseamnă că utilizatorul nu le va vedea.  De obicei sunt scrise astfel:

 
Acum să încercăm să ne dăm seama care etichetă din exemplul nostru de mai sus este responsabilă pentru ce.
Etichetă htmlînseamnă că începe ieșirea codului html.
cap– secțiunea informații despre service.  Printre altele, iată titlu, care este responsabil pentru textul din titlul ferestrei browserului.  Această secțiune poate fi tratată și ca informații pe care dorim să le spunem browserului despre această pagină.
corp– începe partea principală a documentului.
h 1- titlu.
h 2– subtitrare.
p– paragraful.
Probabil asta e tot!  Dacă acesta a fost primul tău document HTML, atunci felicitări!  Da, nu arată atât de grozav pe cât ne-am dori.  Dar, cu toate acestea, avem materiale la care putem deja să lucrăm.  Și în următoarele lecții, totul va fi și mai interesant și vom atinge încet lucrul cu foi de stil în cascadă (CSS).
 
< Назад 

Pentru a comenta, trebuie să vă înregistrați.