Sunteți pe pagina 1din 8

Aceasta sectiune a specificatiei discuta cateva elemente si atribute HTML care pot fi utilizate pentru formatarea vizuala a elementelor.

Multe dintre ele sunt depasite.

15.1 Formatarea
15.1.1 Culoarea de fundal
Definitiile atributelor

bgcolor = color [CI] Depasit. Acest atribut seteaza culoarea de fundal pentru corpul documentului sau celulele tabelelor. Acest atribut seteaza culoarea de fundal a canavalei pentru corpul documentului (elementul BODY) sau pentru tabele (elementele TABLE, TR, TH si TD). Atribute aditionale pentru specificarea culorii textului pot fi utilizate cu elementul BODY. Acest atribut a fost declarat depasit in favoarea foilor de stil pentru specificarea informatiilor de culoare a fundalului.

15.1.2 Aliniere
Este posibil sa se alinieze elemente bloc (tabele, imagini, obiecte, paragrafe, etc.) pe canava cu atributul align. Desi acest atribut poate fi setat pentru multe elemente HTML, domeniul de valori posibile pentru el difera cateodata de la element la element. Aici discutam numai intelesul atributului align pentru text.
Definitiile atributelor

align = left|center|right|justify [CI] Depasit. Acest atribut specifica alinierea orizontala a acestui element in relatie cu contextul inconjurator. Valori posibile:

left: liniile text sunt interpretate aliniate la stanga. center: liniile text sunt centrate. right: liniile text sunt interpretate aliniate la dreapta. justify: liniile text sunt aliniate la ambele margini.

Valorile implicite depind de directia de baza a textului. Pentru textul stanga spre dreapta, implicit este align=left, in timp ce pentru textul dreapta spre stanga, implicit estealign=right. EXEMPLU DEPASIT: Acest exemplu centreaza un antet pe canava.
<H1 align="center"> Cum sa se sculpteze lemn </H1>

Utilizand CSS, de exemplu, puteti obtine acelasi efect dupa cum urmeaza:
<HEAD> <TITLE>Cum sa se sculpteze lemn</TITLE> <STYLE type="text/css"> H1 { text-align: center} </STYLE> <BODY> <H1> Cum sa se sculpteze lemn </H1>

De notat ca aceasta va centra toate declaratiile H1. Puteti reduce scopul stilului setand atributul class pe element:
<HEAD> <TITLE>Cum sa se sculpteze lemn</TITLE> <STYLE type="text/css"> H1.wood {text-align: center} </STYLE> <BODY> <H1 class="wood"> Cum sa se sculpteze lemn </H1>

EXEMPLU DEPASIT: In mod similar, pentru alinierea la dreapta a unui paragraf pe canvas cu atributul HTML align puteti avea:
<P align="right">...O gramada de text pentru paragraf...

care, cu CSS, ar fi:


<HEAD> <TITLE>Cum sa se sculpteze lemn</TITLE> <STYLE type="text/css"> P.mypar {text-align: right} </STYLE> <BODY> <P class="mypar">...O gramada de text pentru paragraf...

EXEMPLU DEPASIT: Pentru a alinia la dreapta o serie de paragrafe, grupati-le cu elementul DIV:

<DIV align="right"> <P>...text in primul paragraf... <P>...text in al doilea paragraf... <P>...text in al treilea paragraf... </DIV>

Cu CSS, proprietatea de aliniere a textului este mostenita de la elementul parinte, de aceea puteti utiliza:
<HEAD> <TITLE>Cum sa se sculpteze lemn</TITLE> <STYLE type="text/css"> DIV.mypars {text-align: right} </STYLE> <BODY> <DIV class="mypars"> <P>...text in primul paragraf... <P>...text in al doilea paragraf... <P>...text in al treilea paragraf... </DIV>

Pentru centrarea intregului document cu CSS:


<HEAD> <TITLE>Cum sa se sculpteze lemn</TITLE> <STYLE type="text/css"> BODY {text-align: center} </STYLE> <BODY> ...corpul este centrat... </BODY>

Elementul CENTER este echivalent exact cu specificarea elementului DIV cu atributul align setat la "center". Elementul CENTER este depasit.

15.1.3 Obiecte plutitoare


Imaginile si obiectele pot apare direct "in-linie" sau pot fi purtate la o margine a paginii, alterand temporar marginile textului care poate curge pe oricare parte a obiectului. Plutirea unui obiect Atributul align pentru obiecte, imagini, tabele, frameuri, etc., determina un obiect sa pluteasca la marginea din stanga sau dreapta. Obiectele plutitoare in general incep o linie noua. Acest atribut ia urmatoarele valori:

left: Obiectul pluteste catre marginea curenta din stanga. Textul care urmeaza curge de-a lungul marginii din dreapta a imaginii. right: Obiectul pluteste catre marginea curenta din dreapta.Textul care urmeaza curge de-a lungul marginii din stanga a imaginii.

EXEMPLU DEPASIT: Exemplul urmator arata cum sa se faca un element IMG sa pluteasca spre marginea din stanga curenta a canavalei.
<IMG align="left" src="http://foo.com/animage.gif" alt="my boat">

Anumite atribute de aliniere permit valoarea "center", care nu determina plutirea ci centreaza obiectul in interiorul marginilor curente. Totusi, pentru P si DIV, valoarea "center" determina continutul elementului sa fie centrat. Plutirea textului in jurul unui obiect Alt atribut, definit de elementul BR, controleaza curgerea textului in jurul obiectelor plutitoare.
Definitiile atributelor

clear = none|left|right|all [CI] Depasit. Specifica unde urmatoarea linie ar trebui sa sa apara intr-un browser vizual dupa noua linie cauzata de acest element. Acest atribut ia in considerare obiectele plutitoare (imagini, tabele, etc.). Valori posibile:

none: Urmatoarea linie va incepe normal. Aceasta este valoarea implicita. left: Urmatoarea linie va incepe la cea mai apropiata linie mai jos de orice obiect plutitor la marginea din stanga. right: Urmatoarea linie va incepe la cea mai apropiata linie mai jos de orice obiect plutitor la marginea din dreapta. all: Urmatoarea linie va incepe la cea mai apropiata linie mai jos de orice obiect plutitor la oricare dintre margini.

Sa consideram urmatorul scenariu vizual, unde textul curge la dreapta unei imagini pana cand o linie este intrerupta de un BR:
********* -------

| | | image | | | *********

--------<BR>

Daca atributul clear este setat ca none, linia care urmeaza dupa BR va incepe imediat mai jos de el la marginea din dreapta a imaginii:
********* | | | image | | | ********* --------------<BR> ------

EXEMPLU DEPASIT: Daca atributul clear este setat ca left sau all, urmatoarea linie va apare dupa cum urmeaza:
********* ------| | ------| image | --<BR clear="left"> | | ********* -----------------

Utilizand foile de stil, puteti specifica ca toate liniile noi sa se comporte in acest mod pentru obiecte (imagini, tabele, etc.) plutind catre marginea din stanga. Cu CSS, puteti obtine aceasta dupa cum urmeaza:
<STYLE type="text/css"> BR { clear: left } </STYLE>

Pentru a specifica acest comportament pentru o instanta specifica a elementului BR, puteti combina informatiile de stil cu atributul id:
<HEAD> ... <STYLE type="text/css"> BR#mybr { clear: left } </STYLE> </HEAD> <BODY> <P>... ********* ------| | ------| table | --<BR id="mybr"> | | ********* ----------------...

</BODY>

15.2 Fonturi
Urmatoarele elemente HTML specifica informatiile pentru fonturi. Desi ele nu sunt declarate depasite, utilizarea lor este descurajata in favoarea foilor de stil.

15.2.1 Elemente de stil ale fonturilor: elementele TT, I, B, BIG, SMALL, STRIKE, S, si U
<!ENTITY % fontstyle "TT | I | B | BIG | SMALL"> <!ELEMENT (%fontstyle;|%phrase;) - - (%inline;)*> <!ATTLIST (%fontstyle;|%phrase;) %attrs; -- %coreattrs, %i18n, %events ->

Eticheta de start: necesara, Eticheta de final: necesara Atribute definite in alta parte

id, class (identificatori pentru intreg documentul) lang (informatii de limba), dir (directia textului) title (titlul elementului) style (informatii de stil inline) onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown onkeyup (ev enimente intrinseci)

Interpretarea elementelor de stil al fonturilor depind de agentul utilizator. Ce urmeaza este numai o descriere informativa. TT: Se interpreteaza ca teletip sau text monospatiat . I: Se interpreteaza ca stil de text italic. B: Se interpreteaza ca stil de text bold. BIG: Se interpreteaza textul cu un font larg ("large"). SMALL: Se interpreteaza textul cu un font mic ("small"). STRIKE si S: Depasit. Se interpreteaza stilul textului taiat (strikethrough). U: Depasit. Se interpreteaza ca text subliniat. Urmatoarea propozitie arata cateva tipuri de text:
<P><b>bold</b>,

<i>italic</i>, <b><i>bold italic</i></b>, <tt>teletype text</tt>, and <big>big</big> and <small>small</small> text.

Aceste cuvinte pot fi interpretate dupa cum urmeaza:

Este posibil sa se obtina o mult mai bogata varietate de efecte ale fonturilor utilizand foile de stil. Pentru a specifica text italic, albastru, intr-un paragraf cu CSS:
<HEAD> <STYLE type="text/css"> P#mypar {font-style: italic; color: blue} </STYLE> </HEAD> <P id="mypar">...O multime de text italic albastru...

Elementele de stil ale fonturilor trebuie sa fie incapsulate corespunzator. Interpretarea elementelor de stil ale fonturilor incapsulate depind de agentul utilizator.

15.2.2 Elemente de modificare ale fonturilor: FONT si BASEFONT


FONT si BASEFONT sunt depasite. Vedeti DTD-ul Tranzitional pentru definitia formala.
Definitiile atributelor

size = cdata [CN] Depasit. Acest atribut seteaza dimensiunea unui font. Valori posibile:

Un intreg intre 1 si 7. Aceasta seteaza fontul la o anumita dimensiune fixa, a carei interpretare depinde de agentul utilizator. Nu toti agentii pot interpreta toate cele sapte dimensiuni. O crestere relativa in dimensiunea fontului. Valoarea "+1" inseamna o dimensiune mai mare. Valoarea "-3" inseamna trei dimensiuni mai mici. Toate dimensiunile apartin unei scale de la 1 la 7.

color = color [CI] Depasit. Acest atribut seteaza culoarea textului. face = cdata [CI]

Depasit. Acest atribut defineste o lista de nume de fonturi separate cu virgule in care agentul utilizator ar trebui sa caute in ordinea de preferinte.
Atribute definite in alta parte

id, class (identificatori pentru intreg documentul) lang (informatii de limba), dir (directia textului) title (titlul elementului) style (informatii de stil inline)

Elementul FONT schimba dimensiunea fontului si culoarea textului in continuturile sale. Elementul BASEFONT seteaza dimensiunea fontului de baza (utilizand atributul size). Schimbarile de dimensiune a fontului obtinute cu FONT sunt relative la dimensiunea fontului de baza setate cu BASEFONT. Daca BASEFONT nu este utilizat, dimensiunea implicita a fontului de baza este 3.

S-ar putea să vă placă și