Formatarea documentelor HTML

Formatarea documentelor HTML

• Titluri - Headings

Sunt sase niveluri de titluri, numerotate de la 1 la 6, pentru 1 caracterele fiind cele mai mari. Automat sub titlu apare un rand gol.

Sintaxa este:

<Hy>Text titlu</Hy>

unde y are una din valorile 1..6.

Iata mai jos un exemplu de sursa HTML pentru cele 6 niveluri de titluri si afisarea lor:

• Paragrafe

In editarea fisierelor HTML, caracterul CR este ignorat. Pentru trecerea la un nou paragraf, aceasta insemnand un rand liber si apoi trecerea la cel urmator, se foloseste eticheta <P>. De obicei textul unui paragraf se include in etichetele perechi, cea de inchidere nefiind insa obligatorie; la intalnirea unei etichete <P>, browserul intelege faptul ca paragraful precedent s-a incheiat.

<P [align=x]>text paragraf</P>

Alinierea implicita este la stanga ( left ); pentru centrata ( center ), respectiv la dreapta ( right ) trebuie precizate.

Exemplu - la afisare, caracterele <CR> sunt ignorate:

Pentru aliniere se mai pot folosi <DIV align=#></DIV> respectiv <CENTER></CENTER>

• Rand nou

Trecerea la un rand nou se face cu eticheta <BR> In principiu <P> echivaleaza cu <BR><BR>

Intr-un editor WYSIWYG, tastarea CR introduce o eticheta <BR> in fisierul HTML.

REFERAT: Programare bon - linia de vanzare, forme de plata REFERAT: Descrierea calculatorului

• Text preformatat

Daca se include textul intre etichetele de preformatare <PRE> si </PRE>, va fi afisat in browser exact cum a fost introdus in fisierul HTML. Este util spre exemplu pentru a afisa sursa unui program. 

Liniile de mai jos, inserate in aceasta forma in sursa HTML, vor face ca in browser ele sa fie reproduse la fel ( cu exceptia etichetelor de preformatare, bineinteles ):

• Linii orizontale

Elementul <HR [atribute]> insereaza o linie orizontala. Atributele posibile:

• size - grosime ( in pixeli )
• width - lungime: data in pixeli sau procentual
• align - aliniere; implicita center
• noshade/shade
• color - culoare

Iata linia afisata pentru eticheta din sursa HTML:

<HR size=3 width=320 align=left noshade color='blue'>

Exista doua stiluri de formatare a caracterelor: fizica si logica - pentru consistenta, este indicat ca intr-un document sa se utilizeze doar un stil. 

• Formatare fizica

• Formatare Logica

Iata mai jos cateva dintre etichetele pentru formatare logica - in paranteza apare interpretarea obisnuita a browserelor:

<DFN></DFN> - pentru definirea unui cuvant ( Italic )
<EM></EM> - pentru accentuarea unui termen ( emphisis - Italic ) 
<CITE></CITE> - citat  ( Italic )
<CODE></CODE> - afisare cod  ( Font Courier New )
<KBD></KBD> - informatia tastata  ( Font Courier New )
<SAMP></SAMP> - rezultat program  ( Font Courier New )
<STRONG></STRONG> - marcare ( Bold )
<VAR></VAR> - valoarea unei variabile  ( Italic )
<BLOCKQUOTE></BLOCKQUOTE> - bloc citat  ( indendare ambelele margini )
<ADDRESS></ADDRESS> - informatia adresa  ( Italic )

Pentru afisarea unor caractere si simboluri speciale standardul HTML prevede folosirea unor secvente incadrate intre & si ; Cele mai utilizate apar in tabelul de mai jos:

Dupa parcurgerea materialului, includeti intr-un fisier HTML cat mai multe din formatarile din material. Fisierul va fi prezentat la laborator trebuind sa contina cel putin:

• trei paragrafe cu alinieri diferite si titlurile lor
• linii pentru separarea paragrafelor - si cu atributul culoare 
• un paragraf va fi preformatat
• toate formatarile fizice de caractere, cu trei fonturi si trei culori diferite
• trei caractere speciale
• trei formatari logice.