• Nivele de titluri (h1–h3) + caractere românești
HTML — Elementele de bază
Structura minimă a unei pagini
Doctype, <html>, <head>, <body>
• Paragrafe + treceri la rând nou + aliniere stânga/centru/dreapta
Acesta este un paragraf standard. HTML definește structura unei pagini.
Text centrat (stil inline pentru demonstrație)
Text aliniat la dreapta
• Imagine cu titlu (hover) + text care o înconjoară (float)
Imaginea din dreapta este obtectă (wrap) de text folosind clasa .float-img.
Recomandat este să folosești întotdeauna atributele alt și title pentru
accesibilitate și indicii la hover.
• Liste: neordonate, ordonate (tipuri diferite), și liste de definiții
Liste neordonate și ordonate
- Element HTML
- <h1>
- <p>
- <a>
- Atribut
- Valoare
- Head
- Body
- Footer
Listă de definiții
- <h1>…</h1>
- Titlu de nivel 1
- <p>…</p>
- Paragraf
- <a>…</a>
- Legătură (link)
• Linkuri interne, externe, email + ancoră la începutul paginii
Urcă sus ·
MDN Web Docs ·
Trimite email ·
Imagine ca link
• Tabel cu chenar, fundal, celule unite (colspan/rowspan), aliniere în celule
| Anatomia unei pagini HTML | |||
|---|---|---|---|
| Secțiune | Tag | Descriere | Exemplu |
| Head | <title> | Titlul paginii | <title>Exemplu</title> |
| <meta> | Metadate (charset, viewport) | <meta charset="utf-8"> | |
| Body | <h1>, <p>, <img> | Conținut vizibil | Texte, imagini, liste |
• Maparea imaginilor în 2 forme (rect & circle) + linkuri pe zone
Dă click pe București (dreptunghi) sau Cluj (cerc):
*Zonele evidențiate sunt doar pentru demonstrație; poți ajusta coordonatele după nevoie.
• Butoane și link cu imagine (button cu ![]()
)
Resurse• Liste cu marcator imagine (list-style-image din style.css)
- Secțiunea „Structură”
- Secțiunea „Conținut”
- Secțiunea „Media”
• Comentarii în cod + organizare semantică