Tutorial – Formatare text în HTML – Website

În HTML trecerea la un rând nou se face doar prin introducerea etichetei <br> iar pentru paragraf nou cu eticheta <p>.

Exemplu:

HTML Afișare
Probă text.<br>
Text pe un rând nou.<p>
Text într-un paragraf nou.
Probă text.
Text pe un rând nou.Text într-un paragraf nou.

 

<hr> Introduce o linie linie orizontală și trecerea la un rând nou.


Folosind etichete adecvate textul poate fi formatat.
Spre exemplu fonturilor li se poate modifica: mărimea, culoarea, forma (normal, bold, italic), familia (Arial, Verdana, etc.), textul poate fi aliniat pe orizontala sau pe verticală iar titlurile (header), de la 1 la 6, sunt diferite ca mărime (1 cel mai mare iar 6 cel mai mic).

Etichetele <span> și </span> delimitează un șir de caractere în vederea formatării.

Etichetele <div> și </div> sunt similare etichetelor <span> și </span>, cu diferența că formatează mai multe elemente și introduc un rând nou înainte și după sfârșitul zonei formatate.

Unul din atributele blocului div este align care poate lua valorile:
center aliniere pe centru
left aliniere la stânga
right aliniere la dreapta

În situația în care dorim ca textul introdus să fie afișat exact așa cum a fost introdus (text preformatat) în fișierul sursă vom folosi pereche de etichete <pre> și </pre>.

Exemplu:

 

HTML Afișare
text normal text normal
<b>text bold</b> text bold
<i>text cursiv</i> text cursiv
<u>text subliniat</u> text subliniat
<del>text tăiat</del> text tăiat
<sup>exponent</sup> exponent
<sub>indice</sub> indice
<tt>caractere monospațiate</tt> caractere monospațiate
<cite>Citat</cite> Citat
<em>evidențiat</em> evidențiat
<code>text conținând cod de computer</code> text conținând cod de computer
<kbd>text conținând cod de computer</kbd> text conținând cod de computer
<samp>mostră de cod de computer</samp> mostră de cod de computer
<strong>text îngroșat</strong> text îngroșat
<big>mare</big> mare
<small>mic</small> mic
<font color=”red”>font roșu</font> font roșu
<font face=”Courier”>font Courier</font> font Courier
<font size=”6″>font size=6</font> font size=6
<div align=”center”>text aliniat pe centru</div>
text aliniat pe centru
<div align=”left”>text aliniat la stânga</div>
text aliniat la stânga
<div align=”right”>text aliniat la dreapta</div>
text aliniat la dreapta
<h1>Titlu 1</h1>

Titlu 1

<h2>Titlu 2</h2>

Titlu 2

<h3>Titlu 3</h3>

Titlu 3

<h4>Titlu 4</h4>

Titlu 4

<h5>Titlu 5</h5>
Titlu 5
<h6>Titlu 6</h6>
Titlu 6

 

Legendă:
br = line break
p = paragraph
hr = horizontal rule

Dacă ți-a plăcut acest tutorial, aștept comentariul tău!

4.868 Vizitatori

Cât de utilă a fost această postare?

Dați click pe o stea pentru a evalua acestă postare!

Rată medie 0 / 5. Număr de voturi: 0

Nu există voturi până acum! Fii prima persoană care evaluează acestă postare.

Îmi pare rău că această postare nu a fost utilă pentru tine!

Să îmbunătățim acest postare!

Spune-mi cum pot îmbunătăți această postare?

Lasă-mi un comentariu!

Acest site folosește Akismet pentru a reduce spamul. Află cum sunt procesate datele comentariilor tale.