Atestat Stoica Darius

Colegiul Național „Alexandru Ioan Cuza”, Galați
Examen de atestare profesională

pentru absolvenții claselor de
matematică – informatică
Profesor îndrumător, Elev,

Grigore Magdalena/ Stoica Darius Andrei
Ilie Elena Daniela
Anul școlar
2023-2024
TEMA PROIECTULUI:
SITE-URI WEB
2
Cuprins
Notiuni Teoretice ………………………………………………………………………………………… 4

Prezentare site ……………………………………………………………………………………………. 13
3
Ce este HTML?
• HTML înseamnă Hyper Text Markup Language
• HTML este limbajul de marcare standard pentru crearea paginilor Web
• HTML descrie structura unei pagini Web
• HTML constă dintr-o serie de elemente
• Elementele HTML indică browserului cum să afișeze conținutul
• Elementele HTML etichetează părți de conținut precum „acesta este un titlu”, „acesta este
un paragraf”, „acesta este un link”, etc.
Un simplu Document HTML

Exemplu
<!DOCTYPE html>
<html>
<head>
<title>Titlul Paginii title>
</head>
<body>
<h1>Primul meu titlu</h1>

<p>Primul meu paragraf</p>
</body>
</html>
Explicația exemplului:
• Declarația <!DOCTYPE html> definește că acest document este un document HTML5
• Elementul <html> este elementul rădăcină al unei pagini HTML
• Elementul <head> conține meta informații despre pagina HTML
• Elementul <title> specifică un titlu pentru pagina HTML (care este afișat în bara de titlu a
browserului sau în fila paginii)
• Elementul <body> definește corpul documentului și este un container pentru toate
conținuturile vizibile, cum ar fi titluri, paragrafe, imagini, hyperlinkuri, tabele, liste etc.
• Elementul <h1> definește un titlu mare
• Elementul <p> definește un paragraf
Ce este un element HTML?
Start tag Element content End tag
4
<h1> Primul meu alineat </h1>
<p> Primul meu paragraf. </p>
<br> none none
Un element HTML este definit de o etichetă de început, un conținut și o etichetă de final:

<tagname> Scrisul vine aici... </tagname>
Elementul HTML este totul, de la eticheta de început până la eticheta de final:
<h1>Primul meu alineat</h1>
<p>Primul meu paragraf.</p>
Browsere web
Scopul unui browser web (Chrome, Edge, Firefox, Safari) este de a citi documente HTML și
de a le afișa corect.
Un browser nu afișează etichetele HTML, ci le folosește pentru a determina modul de afișare

a documentului
5
HTML Structura Paginii
Mai jos este o vizualizare a structurii unei pagini HTML:
Documente HTML
Toate documentele HTML trebuie să înceapă cu o declarație de tip de document: <!
DOCTYPE html>.
Documentul HTML în sine începe cu <html> și se termină cu </html>.
Partea vizibilă a documentului HTML se află între <body> și </body>.
Example
<!DOCTYPE html>
<html>
<body>
<h1>Primul meu titlu</h1>

<p>Primul meu paragraf.</p>
</body>
</html>
Declarația <!DOCTYPE>
Declarația <!DOCTYPE> reprezintă tipul de document și ajută browserele să afișeze corect
paginile web.
Trebuie să apară o singură dată, în partea de sus a paginii (înaintea oricăror etichete HTML).
Declarația <!DOCTYPE> nu face distincție între majuscule și minuscule.
Declarația <!DOCTYPE> pentru HTML5 este:
<!DOCTYPE html>
6
Titluri HTML
Titlurile HTML sunt definite cu etichetele <h1> până la <h6>.
<h1> definește cel mai important titlu. <h6> definește titlul cel mai puțin important:
<h1>Asta este titlul 1</h1>
<h2> Asta este titlul 2</h2>
<h3> Asta este titlul 3</h3>
Exemplu
<p>Asta e un paragraf.</p>
<p>Acesta este un alt paragraf.</p>
HTML Linkuri
Legăturile HTML sunt definite cu eticheta<a>:
Exemplu
<a href=" https://www.google.com"> Acesta este un link</a>
Destinația linkului este specificată în atributul href.
Atributele sunt folosite pentru a furniza informații suplimentare despre elementele HTML.
Veți afla mai multe despre atribute într-un capitol ulterior.
Imagini HTML
Imaginile HTML sunt definite cu eticheta <img>.

Fișierul sursă (src), textul alternativ (alt), lățimea și înălțimea sunt furnizate ca atribute:
Example
<img src="google.jpg" alt=" google.com" width="104" height="142">
7
HTML Styles
❮ PreviousUrmatorul ❯
Atributul style HTML este folosit pentru a adăuga stiluri unui element, cum ar fi culoarea,
fontul, dimensiunea și multe altele.
Example
Rosu
Albastru
Sunt mare
- Atributul style HTML
- Setarea stilului unui element HTML se poate face cu atributul style.
- Atributul stil HTML are următoarea sintaxă:
- <tagname style="property:value;">
- Proprietatea este o proprietate CSS. Valoarea este o valoare CSS.
Background-color css proprietatea definește culoarea de fundal pentru un element HTML.
Exemplu
Setați culoarea de fundal pentru o pagină la albastru praf: <body style="background-
color:powderblue;">
<h1>Acesta este un titlu</h1>

<p>Acesta este un alineat.</p>
</body>
Exemplu
Setați culoarea de fundal pentru două elemente diferite:
<body>
<h1 style="background-color:powderblue;">Acesta este un alineat <h1>

<p style="background-color:tomato;">Acesta este un paragraf.</p>
8
</body>
Text Color
Proprietatea culoare CSS definește culoarea textului pentru un element HTML:
Example
<h1 style="color:blue;">Acesta este un alineat</h1>
<p style="color:red;">Acesta este un paragraf.</p>
Fonturi
Proprietatea CSS font-family definește fontul care trebuie utilizat pentru un element HTML:
Example
<h1 style="font-family:verdana;"> Acesta este un alineat </h1>
<p style="font-family:courier;"> Acesta este un paragraf.</p>
Marimea textului
Proprietatea CSS font-size definește dimensiunea textului pentru un element HTML:Example
<h1 style="font-size:300%;"> Acesta este un alineat </h1>
<p style="font-size:160%;"> Acesta este un paragraf.</p>
Aranjarea textului:
Proprietatea CSS text-align definește alinierea orizontală a textului pentru un element
HTML:
Examplu
<h1 style="text-align:center;">Alineat centrat</h1>
<p style="text-align:center;">Paragraf centrat.</p>
9
Rezumatul capitolului
• Utilizați atributul style pentru stilarea elementelor HTML

• Folosiți background-color pentru culoarea de fundal
• Utilizați color pentru culorile textului
• Utilizați font-family pentru fonturile de text
• Folosiți font-size pentru dimensiunile textului
• Utilizați text-align pentru alinierea textului
HTML Colors
Culorile HTML sunt specificate cu nume de culori predefinite sau cu valori

RGB, HEX, HSL, RGBA sau HSLA.
Numele culorilor
În HTML, o culoare poate fi specificată folosind un nume de culoare:
Rosiatic
Galben
Albastru
MediumSeaGreen
Gri
Mov
10
Roz
Gri deschis
HTML suporta la pana 140 de culori.
Culoare fundal
You can set the background color for HTML elements:
Hello World
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod
tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis
nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
Exemplu
<h1 style="background-color:DodgerBlue;">Hello World</h1>
<p style="background-color:Tomato;">Lorem ipsum...</p>
Culoare text
Puteți seta culoarea textului:
Hello World
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod
tincidunt ut laoreet dolore magna aliquam erat volutpat.
Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut
aliquip ex ea commodo consequat.
Exemplu
11
<h1 style="color:Tomato;">Hello World</h1>
<p style="color:DodgerBlue;">Lorem ipsum...</p>
<p style="color:MediumSeaGreen;">Ut wisi enim...</p>
Culoarea borderului
Poti schimba culoarea la bordere:
Hello World
Hello World
Hello World
Exemplu
<h1 style="border:2px solid Tomato;">Hello World</h1>
<h1 style="border:2px solid DodgerBlue;">Hello World</h1>
<h1 style="border:2px solid Violet;">Hello World</h1
Prezent are site
12
13
14

Atestat Stoica Darius

Încărcat de

Informații document

Titlu original

Drepturi de autor

Formate disponibile

Partajați acest document

Partajați sau inserați document

Opțiuni de partajare

Vi se pare util acest document?

Este necorespunzător acest conținut?

Drepturi de autor:

Formate disponibile

Atestat Stoica Darius

Încărcat de

Drepturi de autor:

Formate disponibile

Colegiul Național „Alexandru Ioan Cuza”, Galați

Examen de atestare profesională

Profesor îndrumător, Elev,

Notiuni Teoretice ………………………………………………………………………………………… 4

Un simplu Document HTML

<h1>Primul meu titlu</h1>

Ce este un element HTML?

Start tag Element content End tag

<p> Primul meu paragraf. </p>

<br> none none

Un element HTML este definit de o etichetă de început, un conținut și o etichetă de final:

Un browser nu afișează etichetele HTML, ci le folosește pentru a determina modul de afișare

<h1>Primul meu titlu</h1>

Destinația linkului este specificată în atributul href.

Veți afla mai multe despre atribute într-un capitol ulterior.

Imaginile HTML sunt definite cu eticheta <img>.

Background-color css proprietatea definește culoarea de fundal pentru un element HTML.

<h1>Acesta este un titlu</h1>

<h1 style="background-color:powderblue;">Acesta este un alineat <h1>

• Utilizați atributul style pentru stilarea elementelor HTML

Culorile HTML sunt specificate cu nume de culori predefinite sau cu valori

HTML suporta la pana 140 de culori.

Poti schimba culoarea la bordere:

Prezent are site

S-ar putea să vă placă și