Categorie:HTML
From NetartHost Wiki
| HTML | ||
| Formatare Text | Legaturi | Imagini |
Contents |
HTML
HyperText Markup Language (HTML) este un limbaj de marcare utilizat pentru crearea paginilor web ce pot fi afişate într-un browser (sau navigator). Descrierea completa gasiti pe Wikipedia
Paginile HTML contin elemente (etichete sau tag-uri) si au extensia .html sau .htm.
Taguri
Elemetele sunt incadrate de tag-uri. Tag-urile sunt simbolurile care marcheaza inceputul si sfarsitul unui element <eticheta atribut="valoare"> ... </eticheta>.
Exemplu de etichete si elemente:
|
Avem elementele<li> si </li> delimitate de etichetele <ul>si </ul>
<ul> <li type="square">Patrat</li> <li type="circle">Cerc</li> <li type="disc">Disc</li> </ul>
Un fisier Html este compus din mai multe zone, acestea fiind alcatuite din tag-uri.
Orice fişier html are următoarea structură :
<html> <head> <title>Titlul</title> </head> <body> Continutul paginii </body> </html>
- Tagul Title
<title>Titlu</title>
Defineste Titlul paginii si este afisat in browser(Title Bar)
- Tagul Body
Intre tagurile <body></body> se scriu informatiile ce vor aparea in pagina returnata de browser.
- Zona Head
Informatia inclusa in aceasta pagina descrie documentul, dar nu apare in continutul paginii returnate de browser.
Meta Tag-uri
Meta Tag-urile sunt taguri HTML folosite pentru a descrie continutul unui site web. Aceste Meta Tag-uri ajuta la indexarea paginii web in motoarele de cautare.
Cele mai importante Meta Tag-uri:
- Description - Trebuie sa contina descrierea paginii web.
- Keywords - Trebuie sa contina cuvinte cheie definitorii pentru pagina web.
- Robots - Informeaza robotii de cautare asupra paginilor ce trebuiesc indexate.
Elemente de marcare
- Marcarea structurala - descrie scopul si importanta unui text.
<h1>Titlul paginii</h1> "h1" este folosit doar o singura data in pagina, acesta defineste Titlul Paginii.
Titlurile importante din pagina(h1, h2, etc.).
- Marcare pentru prezentare - descrie cum apare un text in pagina.
- - Text ingrosat Codul:
<b>Text ingrosat</b> - - Text italic Codul:
<i>Text italic</i>
Marcatorii de prezentare impreuna cu foile de stiluri CSS determina cum va fi afisat continutul din interiorul marcatorului.
- Marcare pentru hiperlink - leaga parti ale unui document cu alte documente.
- -
<a href="http://www.domeniu.ro/">Pagina mea </a>
- Elemente speciale(widget) - Creează obiecte, cum ar fi butoanele şi listele..
Exemplu
Deschideti un editor de text oarecare(Notepad) si salvati codul intr-un fisier index.html.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Tutorial Html</title> <meta http-equiv="Content-type" content="text/html; charset=UTF-8" /> <meta name="Robots" content="ALL" /> <meta name="keywords" content="tutorial, html" /> <meta name="description" content="Tutorial Html- Creare pagina web" /> <link rel="shortcut icon" href="/favicon.ico"/> </head> <body> <h1>Tutorial Html </h1><br /> <h2> 1. Formatare Text </h2><br /> <b>Un exemplu de text ingrosat</b>. Adaugam culoare acelui text fara sa ne folosim de CSS: <font color="red">Text colorat</font><br /> Acum alegem marime font: <font size="4">font size=4</font><br /> <h2>2. Adaugare legatura catre anumita pagina </h2><br /> Pagina <a href="index.html" title="Pagina Index">Index.html</a>, ideal este sa adaugati adresa completa http://www.pagina.ro/index.html sau http://pagina.ro/index.html <h2>3. Adaugare imagini </h2><br /> <img src="imagine.gif" alt="Imagine" width="100" height="100" border="0" /> <h3>3.1 Adaugare imagine cu legatura catre anumita pagina </h3> <a href="http://domeniu.ro"><img src="link.gif" alt="Imagine Link" width="70" height="30" border="2" /></a><br /> </body> </html>
