Utilizarea paragrafelor titlu

Atunci când elaborați un document simplu, de obicei îl structurați pe capitole, subcapitole,

secțiuni etc. Este bine ca fiecare element structural să fie precedat de un paragraf titlu (heading) care
descrie succint conținutul său. Paragrafele titlu pot fi utilizate pentru generarea automată a unui tabel de
cuprins (lucru prezentat în capitolul Word – Inserarea unui cuprins într-un document).
Documentele HTML pot fi structurate pe 6 niveluri, existând 6 etichete care definesc nivelul
paragrafului titlu: <H1>, <H2>,…, <H6> cu etichetele de sfârșit obligatorii </H1>, </H2>,…, </H6>.
Nivelul delimitat de etichetele <H1> și</H1> este cel mai important iar <H6> și</H6> cel mai
puțin important. Browserul vizualizează, de obicei, paragrafele titlu cele mai importante cu litere mai mari
decât paragrafele titlu mai puțin importante.
Ex:
<P>Elemente de studiat:
</P>
<H1>Capitolul 1. Formatarea textului
</H1>
<H2>Formatarea la nivel de paragraf
</H2>
<H3>Eticheta DIV
</H3>
<H3>Eticheta P
</H3>
<H2>Formatarea la nivel de caracter
</H2>
<H3>Eticheta FONT
</H3>
TEMĂ:
 Construiți pagina Web pag3.html astfel:
Titlul – Paragrafe
Corpul prezentat în exemplul de mai sus. Stabiliți, atât pentru fundal cât și pentru text, o culoare la
alegere.
 Vizualizați pagina Web.
Înlocuiți etichetele <H3> și </H3> cu <H6> și </H6>.
 Vizualizați pagina Web. Ce observați?
 Modificați corpul paginii Web, având conținutul de mai jos, astfel încât textul subliniat cu 2 linii să
corespundă paragrafelor titlul de nivel 1, textul subliniat cu o linie să corespundă paragrafelor titlul de nivel
3, restul textului (scris obișnuit) să corespundă paragrafelor titlul de nivel 5.

Limbă și comunicare
Limba română
Limbi moderne
Limba engleză
Limba franceză
Matematică și științe ale naturii
Matematică
Fizică
Biologie
Chimie
Chimie organică
Chimie anorganică
 Utilizarea textului preformatat

Prin utilizarea etichetei <PRE>, puteți specifica browserului că textul cuprins între <PRE> și
</PRE> este preformatat. Browserul va respecta, în acest caz, spațierea textului, modul de indentare,
structura liniilor, dimensiunea fontului.
Ex: <PRE>
**
* *
* *
**
</PRE>

TEMĂ:
În corpul paginii Web pag3.html, adăugați secvența din exemplul de mai sus. Vizualizați pagina Web.
Înlocuiți etichetele <PRE> și </PRE> cu <P> respectiv </P>. Vizualizați pagina Web. Ce observați?
 Modificați conținutul paginii Web astfel încât, paragrafele titlu existente în pagina Web, să fie indentate
astfel:
Limbă și comunicare
Limba română
Limbi moderne Notă: Semnificația sublinierilor cu una sau două
Limba engleză linii rămâne aceeași.
Limba franceză
Matematică și științe ale naturii
Matematică
Fizică
Biologie
Chimie
Chimie organică
Chimie anorganică

Utilizarea indicilor și a exponenților

Pentru a plasa un text ca indice (SUBscript), acesta se încadrează între etichetele <SUB> și
</SUB>. Pentru exponent (SUPerscript), se utilizează <SUP> și </SUP>.
Ex: <P> H<SUB>2</SUB>O </P>
<P>Ec=mc<SUP>2</SUP></P>

TEMĂ:
 Adăugați secvența din exemplul de mai sus, la sfârșitul paginii pag3.html. Vizualizați pagina Web.
Adăugați secvența potrivită astfel încât pagina Web pag3.html să conțină, la final, 3 noi paragrafe cu
următorul conținut:
Puțină matematică…
(a+b)2=a2+2ab+b2 Notă: Extras din SUBIECTUL al III-lea, cerința
logab=1 4.a, Bacalaureat 2019- competențe digitale
x=mabur/(mapa+mabur)

Notă: Pentru inserarea ecuațiilor care conțin mai mult decât indici / exponenți, editați ecuațiile în
Word. Salvați, ca imagine, porțiunea din document care cuprinde ecuațiile. Inserați imaginea în documentul
HTML. (Aceste aspecte vor fi prezentate în capitolul Inserarea imaginilor (<IMG>).
 Utilizarea citatelor

Pentru inserarea unui citat se folosește eticheta <BLOCKQUOTE>, împreună cu eticheta

pereche </BLOCKQUOTE> sau <Q> și </Q>.
Etichetele <BLOCKQUOTE> și </BLOCKQUOTE> sunt utilizate pentru citate lungi (formatate la
nivel de bloc), în timp ce etichetele <Q> și </Q> sunt utilizate pentru citate scurte, care nu conțin mai multe
paragrafe (inline).
Obs. Ghilimele care încadrează citatul pot fi scrise efectiv sau prin intermediul referinței
speciale &quot;.
Exemplu:
<BLOCKQUOTE>
<P>
&quot;Nu vezi bine decât cu inima, esențialul e
invizibilpentruochi&quot;
</P>
</BLOCKQUOTE>
<P> Antoine de Saint-Exupery
</P>
Efect: Citatul este scris indentat, ghilimelele sunt generate cu ajutorul referintei&quot;.

TEMĂ:
Construiți pagina pag4.html, în subdirectorul PAG4, astfel:
- Titlul: Citate și imagini
- Corpul paginii conține citatul din exemplul de mai sus.
Stabiliți pentru fundal și text culori la alegere.
 Vizualizați pagina Web.
 Înlocuiți referințele speciale &quot; cu ghilimele( ” ).Vizualizați pagina Web. Ce observați?