Este HTML un limbaj de programare? HTML, CSS, PHP, JavaScript, SQL – ce și de ce

Introducere

Bazele limbajului de programare

1 Despre limbajul html

2 Crearea unui site Web

3 Dispoziții de bază

4 Structura documentului

5 Etichetele pentru corpul documentului

Descrierea creării site-ului

2 Grafice în interiorul unui document

3 Adăugarea de stiluri la un document

4 Optimizarea graficii pentru web

Algoritm pentru lucrări practice

1 Pregătire

2 Crearea site-ului web „Master of Digital Information Processing”

Concluzie

Lista literaturii folosite

Aplicație

În era tehnologiei digitale și computerizării în masă, internetul a devenit o parte integrantă a vieții noastre, iar programarea și designul web sunt o profesie prestigioasă și căutată. La urma urmei, Internetul nu poate exista de la sine și cineva trebuie să creeze pagini de internet, să actualizeze site-uri web în fiecare zi și chiar în fiecare oră, astfel încât utilizatorul să aibă întotdeauna acces la informații actualizate și verificate într-o formă care să fie de înțeles pentru el. Astfel, problematica programării și designului web este foarte relevantă. Prin urmare, tema muncii mele este legată de crearea unui site web în limbajul de programare HTML și a programelor cu care puteți scrie pagini web. Atașez un site web la munca mea ca exemplu a ceea ce poate fi creat dacă cunoașteți limbajul de programare HTML.

Obiect - site-ul web. Subiect - programare site-uri web în HTML.

Scopul lucrării este de a studia limbajul de programare HTML.

Dezvăluie informații de bază despre limbă;

Luați în considerare procesul de creare a unui site web;

Creați un site web bazat pe algoritmul dezvoltat.

Structura: lucrarea constă dintr-o introducere, trei capitole, o concluzie și o listă de referințe.

Text Markup Language (HTML) este un limbaj standard conceput pentru crearea de documente hipertext în mediul WEB. Documentele HTML pot fi vizualizate de diferite tipuri de browsere WEB. Când un document este creat folosind HTML, un browser WEB poate interpreta HTML pentru a evidenția diferitele elemente ale documentului și pentru a le procesa mai întâi. Utilizarea HTML vă permite să formatați documente pentru a fi prezentate folosind fonturi, linii și alte elemente grafice pe orice software de vizualizare WEB.

Majoritatea documentelor au elemente standard, cum ar fi un titlu, paragrafe sau liste. Folosind etichete HTML, puteți desemna aceste elemente, oferind browserelor WEB informațiile minime pentru afișarea acestor elemente, păstrând în același timp structura generală și completitudinea informațională a documentelor. Tot ceea ce este necesar pentru a citi un document HTML este un browser WEB, care interpretează etichetele HTML și afișează documentul pe ecran în forma pe care i-o oferă autorul.

În cele mai multe cazuri, autorul documentului determină strict aspectul documentului. În cazul HTML, cititorul, pe baza capacităților browserului WEB, poate, într-o anumită măsură, controla aspectul documentului (dar nu și conținutul acestuia). HTML vă permite să marcați locul unde ar trebui să apară un titlu sau un paragraf într-un document utilizând o etichetă HTML și apoi permite browserului WEB să interpreteze acele etichete. De exemplu, un browser WEB poate recunoaște începutul unei etichete de paragraf și poate prezenta documentul în forma dorită, în timp ce altul nu are această capacitate și prezintă documentul într-o singură linie. Utilizatorii unor browsere WEB au, de asemenea, posibilitatea de a personaliza dimensiunea și tipul fontului, culoarea și alți parametri care afectează afișarea documentului. Etichetele pot fi împărțite în două categorii:

Etichete care determină modul în care corpul documentului în ansamblu va fi afișat de browserul WEB.

Etichete care descriu proprietățile generale ale documentului, cum ar fi titlul sau autorul documentului.

Principalul avantaj al HTML este că documentul poate fi vizualizat pe diverse tipuri de browsere WEB și pe diverse platforme.

documentele pot fi create folosind orice editor de text sau editori și convertoare HTML specializate. Alegerea editorului care va fi folosit pentru a crea documente HTML depinde numai de confortul și preferințele personale ale fiecărui autor.

De exemplu, editorii HTML, cum ar fi Netscape Navigator Gold de la Netscape, vă permit să creați documente grafic folosind tehnologia WYSIWYG (What You See Is What You Get). Pe de altă parte, majoritatea instrumentelor tradiționale de creare a documentelor au convertoare care vă permit să convertiți documentele în format HTML.

Toate etichetele HTML încep cu „” (paranteză în unghi drept). De obicei, există o etichetă de început și o etichetă de final. De exemplu, iată etichetele de titlu care definesc textul situat în interiorul etichetelor de început și de sfârșit și descriu titlul documentului; majusculele nu sunt importante atunci când introduceți text:

Titlul documentului sau Titlul documentului.

Eticheta de sfârșit arată la fel ca eticheta de început și diferă de aceasta printr-o bară oblică înainte de textul dintre parantezele unghiulare. În acest exemplu, eticheta îi spune browserului WEB să folosească formatul titlului, iar eticheta îi spune textului antetului să se termine.

Unele etichete precum

(etichetă care definește un paragraf) nu necesită o etichetă de final, dar utilizarea acesteia oferă textului sursă al documentului o lizibilitate și o structură îmbunătățite.

Atenţie! Spații suplimentare, file și returnări de transport adăugate la textul sursă al unui document HTML pentru o mai bună lizibilitate vor fi ignorate de browserul WEB atunci când interpretează documentul. Un document HTML poate include elementele de mai sus numai dacă sunt plasate în etichete.

Când un browser WEB primește un document, acesta determină modul în care documentul trebuie interpretat. Prima etichetă care apare în document trebuie să fie . Această etichetă spune browserului WEB că documentul dvs. este scris folosind HTML. Un document HTML minim ar arăta astfel:

Corpul documentului...

Partea antet a documentului. Eticheta pentru capul documentului trebuie folosită imediat după etichetă și nicăieri în corpul documentului. Această etichetă reprezintă o descriere generală a documentului. Evitați să plasați orice text în interiorul . Eticheta de început este plasată imediat înaintea etichetei și a altor etichete care descriu documentul, iar eticheta de final este plasată imediat după sfârșitul descrierii documentului. De exemplu:

O listă de angajați

Titlul documentului. Majoritatea browserelor WEB afișează conținutul etichetei în bara de titlu a ferestrei care conține documentul și în fișierul de marcaje, dacă este acceptat de browserul WEB. Titlul, delimitat de etichetele și, este plasat în interiorul etichetelor -, așa cum se arată în exemplul de mai sus. Titlul documentului nu apare atunci când documentul în sine este afișat în fereastră.

Etichetele pentru corpul documentului identifică componentele documentului HTML afișat în fereastră. Corpul documentului poate conține link-uri către alte documente, text și alte informații formatate.

Corpul documentului. Corpul documentului trebuie să fie între etichetele și. Aceasta este partea din document care este afișată ca text și informații grafice (semantice) ale documentului dumneavoastră.

Niveluri de titlu. Când este scris un document HTML, textul este împărțit structural în doar text, titluri ale unor părți ale textului, titluri de nivel superior etc. Primul nivel de titluri (cel mai mare) este indicat de numărul 1, următorul - 2 etc. Majoritatea browserelor acceptă interpretarea a șase niveluri de titluri, oferindu-le fiecăruia un stil propriu. Anteturile de peste nivelul șase nu sunt standard și este posibil să nu fie acceptate de browser. Titlul de nivel superior are atributul „1”. Sintaxa antetului de nivel 1 este următoarea:

Antet de primul nivel

Titlurile de la un alt nivel pot fi, în general, reprezentate după cum urmează:

Titlu la nivel X, x este un număr de la 1 la 6 care determină nivelul antetului.

Eticheta de paragraf

Spre deosebire de majoritatea procesoarelor de text, returnările transport sunt în general ignorate într-un document HTML. O pauză fizică de paragraf poate fi localizată oriunde în textul sursă al documentului (pentru a fi mai ușor de citit). Cu toate acestea, browserul separă paragrafele numai dacă există o etichetă

Dacă nu separați paragrafele cu eticheta

Documentul dvs. va apărea ca un paragraf mare.

Parametri suplimentari de etichetă

Vă permite să aliniați un paragraf la stânga, la centru și, respectiv, la dreapta.

Centrarea elementelor documentului. Puteți centra toate elementele documentului în fereastra browserului. Puteți folosi eticheta pentru asta.

Toate elementele dintre etichete vor fi în centrul ferestrei. Reformatarea etichetei Reformatarea etichetei Permite ca textul să fie prezentat cu o formatare specifică pe ecran. Textul preformatat se termină cu o etichetă de final. În textul preformatat, aveți voie să utilizați:

a) avans de linie

b) caractere tabulatoare (deplasați 8 caractere la dreapta)

c) font disproporționat instalat de browser.

Utilizarea etichetelor de formatare a paragrafelor, cum ar fi sau , va fi ignorată de browser atunci când sunt plasate între etichete

Lista de grup

Lista grupei 6-M-11

Această listă conține nume de familie, prenume și patronimice.

Lista poate fi folosită numai în scopuri oficiale.

Iată ce veți vedea pe ecranul browserului dvs.:

Atenţie! Antetul „Lista de grup” nu este afișat de browser ca parte a documentului. Va apărea în bara de titlu a ferestrei browserului.

Rupere de linie
. Etichetă
notifică browserul despre o întrerupere de linie. Cel mai bun exemplu de utilizare a acestei etichete este într-o adresă formatată sau în orice altă secvență de linii în care browserul trebuie să le afișeze una sub alta. De exemplu:

Alexei Yartsev
autostrada Dmitrov,
9B, birou 326

Un parametru suplimentar vă permite să extindeți capacitățile etichetei
.

Această opțiune vă permite nu doar să efectuați un avans de linie, ci și să plasați următoarea linie pornind de la marginile libere din stânga (stânga), dreapta (dreapta) sau ambele (toate) marginile ferestrei browserului. De exemplu, dacă există o imagine lângă textul din stânga, atunci puteți utiliza eticheta
pentru a compensa textul de sub imagine:

După cum puteți vedea, această diagramă arată conexiunea

Legături către puncte dintr-un document. Puteți conecta la diferite zone sau secțiuni ale aceluiași document utilizând un marcator ascuns special pentru acele secțiuni. Acest lucru vă permite să vă deplasați rapid de la secțiune la secțiune dintr-un document fără a derula pe ecran. De îndată ce faceți clic pe un link, browserul vă va duce la secțiunea specificată a documentului, iar linia care conține marcatorul de secțiune (de obicei prima linie a secțiunii sau titlul secțiunii) va fi plasată pe prima linie a secțiunii. fereastra browserului (dacă această linie nu este deja prezentă pe ecranul browserului).

Creați un marcator de secțiune. Sintaxa pentru acest marker este următoarea:

Text-care-va-apara-pe-prima-linie

Text

De exemplu:

Lista secțiunilor

• Sectiunea 1
• Sectiunea 2

Sectiunea 1

Textul secțiunii 1

Sectiunea 2

Textul secțiunii 2





Simbolul „#ex1” îi spune browserului să caute un marcator numit „ex1” în acest document HTML.

Când utilizatorul face clic pe linia „Secțiunea 1”, browserul va merge direct la Secțiunea 1.


2.2 Grafice în cadrul unui document

Una dintre cele mai atractive caracteristici ale Web-ului este capacitatea de a include link-uri către grafice și alte tipuri de date într-un document HTML. Acest lucru se face folosind o etichetă . Utilizarea acestei etichete poate îmbunătăți semnificativ aspectul și funcționalitatea documentelor.

Există două moduri de a utiliza grafica în documentele HTML. Prima este încorporarea imaginilor grafice în document, ceea ce permite utilizatorului să vadă imaginile direct în contextul altor elemente ale documentului. Aceasta este cea mai utilizată tehnică în proiectarea documentelor, numită uneori „imagine inline”. Sintaxa etichetei:



Să descriem elementele sintaxei etichetei::

Un parametru obligatoriu care are aceeași sintaxă ca o adresă URL standard. Această adresă URL spune browserului unde se află imaginea. Desenul trebuie stocat într-un format grafic acceptat de browser. Astăzi, formatele GIF și JPG sunt acceptate de majoritatea browserelor.="text":

Acest element opțional specifică textul care va fi afișat într-un browser care nu acceptă afișarea grafică sau cu schimbarea imaginilor dezactivată. De obicei, aceasta este o scurtă descriere a imaginii pe care utilizatorul ar putea sau o va putea vedea pe ecran. Dacă acest parametru este absent, atunci în locul imaginii, majoritatea browserelor afișează o pictogramă (pictogramă), care, atunci când este activată, utilizatorul poate vedea imaginea. Eticheta ALT este recomandată dacă utilizatorii dvs. folosesc un browser care nu acceptă modul grafic, cum ar fi Lynx.=n1:

Acest parametru opțional este utilizat pentru a specifica înălțimea imaginii în pixeli. Dacă acest parametru nu este specificat, se utilizează înălțimea originală a imaginii. Această opțiune vă permite să micșorați sau să întindeți imaginile pe verticală, permițându-vă să definiți mai clar aspectul documentului. Cu toate acestea, unele browsere nu acceptă această opțiune. Pe de altă parte, rezoluția ecranului clientului dvs. poate fi diferită de a dvs., așa că aveți grijă când setați valoarea absolută a unui obiect grafic.=n2:

Parametrul este, de asemenea, opțional, ca și precedentul. Vă permite să setați lățimea absolută a imaginii în pixeli.: Acest parametru este utilizat pentru a spune browserului unde să plaseze următorul bloc de text. Acest lucru vă permite să definiți mai strict aranjarea elementelor pe ecran. Dacă această opțiune nu este utilizată, atunci majoritatea browserelor plasează imaginea în partea stângă a ecranului și textul în dreapta acestuia:

Acest parametru îi spune browserului că această imagine permite utilizatorului să efectueze o anumită acțiune făcând clic pe o anumită locație din imagine. Această caracteristică este o extensie HTML.

Iată un exemplu de utilizare a acestei etichete:



Începând cu HTML 2.0, eticheta au apărut parametri suplimentari:



Opțiuni noi::

Vă permite să setați dimensiunea în pixeli a spațiului gol deasupra și dedesubtul imaginii, astfel încât textul să nu se suprapună cu imaginea. Acest lucru este deosebit de important pentru imaginile generate dinamic, când este imposibil să vedeți documentul în avans:

La fel ca VSPACE, dar numai pe orizontală.

Imagini de fundal. Majoritatea browserelor vă permit să includeți o imagine de fundal în documentul dvs., care va fi matriceată și afișată în fundalul întregului document. Unii utilizatori le place grafica de fundal, altora nu. Un model discret, translucid (tapet) arată de obicei bine ca fundal pentru majoritatea documentelor.

Descrierea imaginii de fundal este inclusă în eticheta BODY și arată astfel:

.

Fiecare dintre parametri determină culoarea unui anumit element. Să descriem acești parametri:

Culoarea fundalului documentului:

Culoarea textului simplu al documentului:

Culoare link. Culoarea este specificată ca un număr de șase cifre în format hexazecimal utilizând schema RGB (roșu, verde, albastru). Culoarea #000000 este neagră, iar culoarea #FFFFFF este albă. De exemplu:

Această linie specifică culoarea de fundal a documentului să fie albă, textul să fie negru, iar linkurile să fie argintie.

Linie orizontală. Folosind eticheta, puteți separa textul cu o linie orizontală.

Format etichetă:

Parametrii etichetei::

Grosimea liniei în pixeli:

Lățimea liniei în pixeli sau procentul din lățimea ferestrei browserului.: Locația ecranului (stânga | centru | dreapta).: În mod implicit, linia este prezentată în vizualizare 3D cu o umbră. NOSHADE vă permite să prezentați o linie ca o simplă dungă întunecată monocromatică.


2.3 Adăugarea de stiluri la un document

vă permite să utilizați diferite stiluri de font pentru a evidenția informațiile text din documentele dvs. Iată o listă scurtă de stiluri acceptate de majoritatea browserelor: (bold)(italic)spaziat (dactilograf - folosind fonturi fixe)

Puteți combina diferite tipuri de stiluri, cum ar fi îndrăzneț și înclinat.


Tabelul nr. 1: Stiluri de bază ale textului




Combinarea stilurilor vă permite să afișați mai multe elemente într-o singură linie cu stiluri diferite, de exemplu:

Viata - este un cântec!

Viața este un cântec!

Atenție! Adăugarea unui număr mare de stiluri și combinații ale acestora face textul dificil de citit!

Stiluri suplimentare:

mare

· mic mic)

· sub (interliniar)

· sup (superscript)


Tabelul nr. 2: Stiluri suplimentare de text




Marimea fontului . Puteți modifica dimensiunea fontului folosind eticheta:

Dimensiunea fontului poate fi de la 1 la 7. Puteți specifica direct dimensiunea fontului cu un număr sau puteți specifica un offset față de valoarea de bază (implicit - 3) într-o direcție pozitivă sau negativă. Valoarea de bază poate fi modificată folosind eticheta:

De exemplu:

Schimbare

Schimbați culoarea fontului. Puteți schimba culoarea fontului folosind eticheta: