Formatarea Textului HTML
HTML are mai multe elemente pentru a da textului o semnificație specială, precum text bold, italic sau evidențiat.
Exemplu
Text bold, italic și subscript/superscript.
Rezultat: pagină HTML completă
<!DOCTYPE html>
<html lang="ro">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Introducere în Formatare</title>
</head>
<body>
<p><b>Acest text este aldin</b></p>
<p><i>Acest text este italic</i></p>
<p>Acesta este <sub>indice</sub> și <sup>exponent</sup></p>
</body>
</html>
Elemente de Formatare HTML
Elementele de formatare afișează tipuri speciale de text: <b> pentru bold, <strong> pentru text important, <i> pentru italic, <em> pentru text accentuat, <mark> pentru text evidențiat, <small> pentru text mai mic, <del> pentru text șters, <ins> pentru text inserat, <sub> pentru indice, și <sup> pentru exponent.
Elementele HTML <b> și <strong>
Elementul <b> face textul bold fără a-i da vreo importanță suplimentară. Elementul <strong> marchează textul ca fiind important, iar conținutul său este de obicei afișat și el bold.
Text bold
Text bold cu <b>.
Rezultat: pagină HTML completă
<!DOCTYPE html>
<html lang="ro">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Aldin</title>
</head>
<body>
<b>Acest text este aldin</b>
</body>
</html>
Text important
Text important cu <strong>.
Rezultat: pagină HTML completă
<!DOCTYPE html>
<html lang="ro">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Strong</title>
</head>
<body>
<strong>Acest text este important!</strong>
</body>
</html>
Elementele HTML <i> și <em>
Elementul <i> marchează textul cu o voce sau o stare alternativă, de obicei afișat italic; este adesea folosit pentru un termen tehnic, o expresie într-o altă limbă, un gând sau numele unei nave. Elementul <em> marchează textul accentuat, de asemenea de obicei italic; un cititor de ecran va rosti textul <em> cu accent vocal.
Text italic
Text italic cu <i>.
Rezultat: pagină HTML completă
<!DOCTYPE html>
<html lang="ro">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Italic</title>
</head>
<body>
<i>Acest text este italic</i>
</body>
</html>
Text accentuat
Text accentuat cu <em>.
Rezultat: pagină HTML completă
<!DOCTYPE html>
<html lang="ro">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Accentuat</title>
</head>
<body>
<em>Acest text este accentuat</em>
</body>
</html>
Elementul HTML <small>
Elementul <small> face textul mai mic.
Exemplu
Text mai mic cu <small>.
Rezultat: pagină HTML completă
<!DOCTYPE html>
<html lang="ro">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Small</title>
</head>
<body>
<small>Acesta este un text mai mic.</small>
</body>
</html>
Elementul HTML <mark>
Elementul <mark> marchează sau evidențiază text.
Exemplu
Un cuvânt evidențiat cu <mark>.
Rezultat: pagină HTML completă
<!DOCTYPE html>
<html lang="ro">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Evidențiat</title>
</head>
<body>
<p>Nu uita să cumperi <mark>lapte</mark> astăzi.</p>
</body>
</html>
Elementul HTML <del>
Elementul <del> marchează text care a fost șters dintr-un document. Browserele de obicei îl taie cu o linie.
Exemplu
Text șters cu <del>.
Rezultat: pagină HTML completă
<!DOCTYPE html>
<html lang="ro">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Del</title>
</head>
<body>
<p>Culoarea mea preferată este <del>albastru</del> roșu.</p>
</body>
</html>
Elementul HTML <ins>
Elementul <ins> marchează text care a fost inserat într-un document. Browserele de obicei îl subliniază.
Exemplu
Text șters și inserat, împreună.
Rezultat: pagină HTML completă
<!DOCTYPE html>
<html lang="ro">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Ins</title>
</head>
<body>
<p>Culoarea mea preferată este <del>albastru</del> <ins>roșu</ins>.</p>
</body>
</html>
Elementul HTML <sub>
Elementul <sub> creează text indice, care stă la jumătate de caracter sub linia normală și este uneori mai mic. Este util pentru lucruri precum formulele chimice, cum ar fi H2O.
Exemplu
Text indice cu <sub>.
Rezultat: pagină HTML completă
<!DOCTYPE html>
<html lang="ro">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Sub</title>
</head>
<body>
<p>Acesta este un text <sub>indice</sub>.</p>
</body>
</html>
Elementul HTML <sup>
Elementul <sup> creează text exponent, care stă la jumătate de caracter deasupra liniei normale și este uneori mai mic. Este util pentru lucruri precum notele de subsol.
Exemplu
Text exponent cu <sup>.
Rezultat: pagină HTML completă
<!DOCTYPE html>
<html lang="ro">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Sup</title>
</head>
<body>
<p>Acesta este un text <sup>exponent</sup>.</p>
</body>
</html>
Elemente HTML de Formatare a Textului
O referință rapidă a tag-urilor de formatare: <b> text bold, <em> text accentuat, <i> voce sau stare alternativă, <small> text mai mic, <strong> text important, <sub> indice, <sup> exponent, <ins> text inserat, <del> text șters, iar <mark> text marcat sau evidențiat.