3: Alinierea textului in html, atributuri – tutoriale html

Atributul align, valign in html

Aliniarea, aranjarea continutului pe linie orizontala se face prin adaugarea unui atribut, atributul align, la tagul respectiv, adica: Daca vrem sa aliniem textul, vom avea de a alege din 3 variante, la stanga (lef), la dreapta (right) sau la mijloc (center). Alinierea continutul in mod vertical se face cu ajutorul atributului valign, care poate prelua valorile, sut(top), mijloc(middle) si bottom(jos).

exemplu pentru alinierea orizontala:

<p align="right">Text aliniat la dreapta, text text</p>

exemplu pentru alinierea verticala:

<div valign="top">Sa presupunem ca aici este o imagine </div>

De obicei “by default”, textul este aliniat la stanga si jos daca nu specificam printr-un atribut o alta aliniere.
Alinierea verticala se foloseste in primul rand in cadrul tabelelor, despre care inca n-am vorbit, dar urmeaza in urmatoarele tutoriale. In cadrul tagului P, nu se foloseste alinierea verticala, pentru ca nu are sens. Paragrafurile sunt alcatuite din randuri, deci numai in cazul div-urilor si a tabelelor se poate folosi valign.

<html>
<head>
<title>Prima pagina in html!</title>
</head>

<body>

<h1>Titlu</h1>

<p align="right">Text aliniat <b>la dreapta</b> </p>
<p align="center">Text aliniat <b>la mijloc</b></p>
<p align="left">Text aliniat <b>la stanga</b></p>

</body>
</html>

Atributuri html - aliniere text, tutorial html pentru incepatori

Informatii suplimentare in legatura cu atributurile din html

Mai demult, atributurile nu au fost “case sensitive”, adica nu conta daca scriam cu litere mici sau mari. Este adevarat ca si in prezent majoritatea browserelor nu plang daca nu folosim 100% corect atributurile, insa acest lucru se va schimba in viitor, asa ca tinet-ti minte, tagurile html si atributurile la taguri, se scriu corect cu litere mici, chiar si daca merg in prezent si cu litere mari.
Testeaza codul html online aici

3 Comentarii

  1. Bogdan a scris la: 11 December 2011 at 13:28

    Foarte tare site-ul. Bravo . Inteleg mai repede decat din cartea HTML 4.

  2. istvan a scris la: 13 December 2011 at 23:42

    Multumim pentru feedback, spor la invatat!

  3. Andrei a scris la: 25 May 2013 at 17:28

    Super tare site-ul . Am inteles foarte mult cu toate ca am fost si sunt novice