etichete html.doc

9
eticheta semnificatie <!-- ??? --> comentariu <! DOCTYPE ...> tipul documentului <a ...> legatura (link) <area> arie, folosita la hartile de imagini <b> bold, text ingrosat <bgsound> adauga paginii muzica de fond <big> font marit <body ...> corpul paginii, contine informatia ce va fi afisata <br> sfarsit de rand <caption ...> "titlul" tabelului <code> text continand cod de computer <cite> citat (text italic) <dd> descrierea definitiei <del> text taiat cu o linie orizontala <div> formateaza un sir de caractere <dl> lista de definitii <dt> termen dintr-o lista de definitii <em> text evidentiat <font ...> font <form ...> formular <frame ...> cadru <frameset ... > defineste blocul compus din cadre <h1 ...> header sau titlu (de la h1 la h6) <head> defineste antetul paginii HTML <hr ...> introduce o linie orizontala <html> anunta ca blocul este tip HTML <i> text italic <iframe ...> fereastra in-line <img ...> imagine <input ...> element (camp) al formularului <kbd> text introdus de la tastatura <li ...> termen al listei <link ...> legatura <meta> metainformatii despre pagina <noframes> text alternativ pentru cadru <ol> lista ordonata <option ...> element al listei de selectii <p ...> paragraf nou

Upload: negut-florin-catalin

Post on 28-Nov-2015

10 views

Category:

Documents


4 download

TRANSCRIPT

Page 1: Etichete HTML.doc

eticheta semnificatie<!-- ??? --> comentariu<!DOCTYPE ...> tipul documentului<a ...> legatura (link)<area> arie, folosita la hartile de imagini<b> bold, text ingrosat<bgsound> adauga paginii muzica de fond<big> font marit<body ...> corpul paginii, contine informatia ce va fi afisata<br> sfarsit de rand<caption ...> "titlul" tabelului<code> text continand cod de computer<cite> citat (text italic)<dd> descrierea definitiei<del> text taiat cu o linie orizontala<div> formateaza un sir de caractere<dl> lista de definitii<dt> termen dintr-o lista de definitii<em> text evidentiat<font ...> font<form ...> formular<frame ...> cadru<frameset ...> defineste blocul compus din cadre<h1 ...> header sau titlu (de la h1 la h6)<head> defineste antetul paginii HTML<hr ...> introduce o linie orizontala<html> anunta ca blocul este tip HTML<i> text italic<iframe ...> fereastra in-line<img ...> imagine<input ...> element (camp) al formularului<kbd> text introdus de la tastatura<li ...> termen al listei<link ...> legatura<meta> metainformatii despre pagina<noframes> text alternativ pentru cadru<ol> lista ordonata<option ...> element al listei de selectii<p ...> paragraf nou<pre ...> text preformatat<select ...> lista de selectii din formular<samp> mostra de cod<span> formateaza mai multe elemente<small> font micsorat<strong> text ingrosat<sub> text indice<sup> text exponent<table ...> tabel<td ...> celula a tabelului<textarea> camp din formular in care se introduce text

Page 2: Etichete HTML.doc

<th> headerul tabelului<title> titlul paginii HTML<tr ...> rand al tabelului<tt> text monospatiat<u> text subliniat<ul> lista neordonata

Etichete HTML de bazăHTML şi XHTMLElementele prezentate în continuare se folosesc pentru a defini structura paginii: marcarea începutului şi a sfârşitului paginii, a capitolelor şi a subcapitolelor, a paragrafelor şi a altor secţiuni ale acesteia. Sunt elemente de bază pe care probabil le vei folosi în orice pagină.

Din punct de vedere al modului în care se comportă în raport cu spaţiul în care se află, elementele HTML sunt de două tipuri:

1. elemente de tip bloc - acestea ocupă toată lăţimea pe care o au la dispoziţie indiferent de lăţimea conţinutului lor. Chiar dacă scrii mai multe astfel de elemente pe acelaşi rând ele se vor afişa unul sub altul.

2. elemente de tip (tradus "în linie") - lăţimea acestor elemente se adaptează lăţimii conţinutului lor. Astfel, dacă există spaţiu, se vor afişa mai multe astfel de elemente pe acelaşi rând chiar dacă le scrii pe rânduri diferite.

<html> </html> marchează începutul şi sfârşitul documentului HTML (paginii). Este un element obligatoriu care trebuie să existe în orice pagină. Poate conţine ca descendenţi direcţi doar elementele head, body şi comentarii.

Page 3: Etichete HTML.doc

<head> </head> marchează antetul documentului, o zonă care conţine elemente carenu se afişează în pagină dar conţin informaţii despre aceasta: titlul documentului, locul în care se află fişierele care descriu aspectul paginii (instrucţiunile CSS), relaţiile documentului cu alte pagini din site, cuvinte cheie care descriu conţinutul paginii, autorul, legături către scripturi, sau instrucţiunile scripturilor din pagină. De exemplu, eticheta "meta" de pe linia 3 a exemplului de mai sus precizează setul de caractere care trebuie folosit pentru a afişa pagina. Este necesară pentru afişarea corectă a diacriticelor (ă î ş ţ â). Singurul element care este obligatoriu să fie inclus în zona headeste title.

<title> </title> este un element obligatoriu care se află în head şi marchează titlul documentului. Este singurul element din head al cărui conţinut este vizibil. Browserul va afişa textul din title pe bara de titlu a ferestrei în care se afişeaă pagina.

<body> </body> marchează corpul documentului, zona care conţine elementele care se afişează în pagină (capitole, paragrafe, imagini, tabele, etc).

<h1> </h1> marchează principalul titlu al paginii. Se recomandă să existe un singur astfel de titlu. De exemplu, dacă ai publica o carte, ai folosi acest element pentru a marca titlul cărţii. Este recomandat ca acest element să fie urmat de unul sau mai multe elemente h2.

<h2> </h2> marchează titlurile a căror importanţă este depăşită doar de h1. De exemplu, dacă ai publica o carte, ai folosi acest element pentru a marca titlurile capitolelor.

<h3> </h3> marchează titlurile a căror importanţă este depăşită de h1 şi h2. De exemplu, dacă ai publica o carte, ai folosi acest element pentru a marca titlurile sub-capitolelor.

<h4> </h4> marchează titlurile a căror importanţă este depăşită de h1, h2 şi h3. De exemplu, dacă ai publica o carte, ai folosi acest element pentru a marca titlurile sub-sub-capitolelor.

<h5> </h5> marchează titlurile a căror importanţă este depăşită de h1, h2, h3 şi h4.

<h6> </h6> marchează titlurile a căror importanţă este depăşită de h1, h2, h3, h4 şi h5.

Toate elementele h sunt elemente de tip bloc şi nu pot conţine decât elemente de tip inline.

Este important ca nivelele titlurilor să fie în ordine: h1 sa fie primul urmat de mai multe h2, fiecare dintre acestea fiind urmate de h3, acestea de h4 şi aşa mai departe până la h6 (nu este recomandat să aveţi de exemplu o succesiune de elemente h1, h2, h2, h4, sărind peste h3). Elementele de tip titlu structurează conţinutul paginii şi îl fac mai accesibil pentru motoarele de căutare sau pentru alte programe. Acestea vor fi capabile să detecteze corect începutul capitolelor sau sub-capitolelor şi să permită, de exemplu, utilizatorilor să sară peste capitolele care nu-i interesează. Cititoarele de pagini folosite de persoanele nevăzătoare pentru a naviga pe net reprezintă un exemplu de astfel de programe. Exemplul de mai jos prezintă modul în care structura unei pagini care conţine elemente h este detectată de aplicaţia numită WebDev :

Page 4: Etichete HTML.doc

<p> </p> marchează un paragraf de text. Browserul va lăsa automat un spaţiu liber înainte şi după textul cuprins între cele două etichete. Acest mod de afişare poate fi schimbat folosind CSS. Este un element de tip bloc şi poate conţine doar elemente inline.

<blockquote> </blockquote> marchează un citat mai lung. Este un element de tip bloc care poate conţine ca descendenţi direcţi doar alte elemente de tip bloc (p de exemplu). Aceste elemente vor putea conţine şi elemente inline.

<q> </q> marchează un citat scurt. Este un element inline.

<div> </div> marchează în pagină o zonă dreptunghiulară în care pot fi cuprinse mai multe elemente. Este de tip bloc şi poate conţine orice tip de elemente.

Page 5: Etichete HTML.doc

<br /> are ca efect afişarea textului care urmează după etichetă pe linia următoare (trece pe rând nou).

<hr /> inserează în pagină o linie orizontală.

Comentariile se pot include în paginile HTML folosind notaţia <!-- comentariu -->. Ele nu vor fi luate în considerare de către browser şi nu vor fi afişate. Se folosesc pentru a include explicaţii destinate celor care citesc codul HTML al paginii.

Exemplul de mai jos prezintă modul de folosire a etichetelor descrise în această lecţie şi modul implicit în care se afişează ele în browser:

Page 6: Etichete HTML.doc

Liste HTMLHTML şi XHTMLStandardul HTML 4.01 permite definirea a trei tipuri de liste în paginile web:

liste neordonate, folosind elementele: <ul> şi <li>;

liste ordonate (sau numerotate), folosind elementele: <ol> şi <li>;

liste de definiţii: folosind elementele: <dl>, <dt> şi <dd>.

Listele neordonate se folosesc pentru a defini orice înşiruire de elemente a căror ordine nu este importantă. Elementul <ul>(unordered list) se foloseşte pentru a marca începutul şi sfârşitul listei, iar elementele <li> (list item) se folosesc pentru a marca fiecare element al listei.Listele ordonate se folosesc atunci când este important să precizăm ordinea elementelor. În acest caz elementele se vor afişa numerotate. Pentru a marca începutul şi sfârşitul listei se foloseşte elementul <ol> (ordered list), iar <li> se foloseşte pentru a defini fiecare element din listă.

Listele de definiţii se folosesc pentru a construi liste de termeni împreună cu definiţiile lor. Elementul <dl> va marca începutul şi sfârşitul listei, <dt> va marca fiecare termen, iar <dd> marchează definiţia corespunzătoare termenilor. Pot exista mai mulţi termeni cu aceeaşi definiţie sau mai multe definiţii pentru acelaşi termen.Imaginea de mai jos vă prezintă câteva exemple de astfel de liste şi modul lor de afişare în Firefox . Precizăm că modul de afişare se poate schimba radical folosind CSS.

Ca elemente ale listei putem avea orice alte elemente HTML sau chiar liste (liste imbricate). Imaginea de mai jos prezintă câteva exemple de liste imbricate.

Page 7: Etichete HTML.doc