Mai mult,scuze de dublu-post!
Introducere in HTML
Ce este WWW?
WWW= World Wide Web , adesea numit Web. Web-ul este o retea de computere din toata lumea. Toate computerele folosesc un standard de comunicare numit HTTP.
Cum functioneaza WWW-ul?
Informatia Web este stocata in documente numite pagini html. Paginile html sunt fisiere stocate in computere numite servere web. Computerele care citesc paginile html sunt numite clienti web. Clientii web vad paginile cu un program numit browser web. Cele mai populare browsere sunt Internet Explorer si Mozilla Firefox (il recomand pe cel din urma).
Cum afiseaza browser-ul paginile html?
Toate paginile html contin instructiuni despre cum sa fie afisate. Browser-ul afiseaza pagina citind aceste instructiuni. Cele mai obisnuite instructiuni de afisare sunt numite taguri HTML. Tagurile HTML arata astfel: .
Cine face standardele Web?
Standardele Web nu sunt facute de Netscape sau Microsoft. Deciziile Web sunt luate de catre W3C. W3C inseamna World Wide Web Consortium. Cele mai importante standarde web sunt HTML, CSS si XML.
Structura
Prima pagina html
Pe desktop se da new text document si i se schimba numele in index.html . Prima pagina a unui site se numeste index.html (Nu este obligatoriu ca extensia sa fie .html . daca de exemplu folositi PHP in pagina de index pagina se va numi index.php ) . Pagina se deschide cu Notepad unde se scrie codul html (poti copia exemplul cu structura de mai jos), salveaza fisierul, inchide-l, apoi deschide-l cu internet explorer. Internet Explorer = IE (prescurtat)
Structura unei pagini
Orice pagina incepe si se sfarseste cu tagurile:
O pagina trebuie sa aiba tagurile:
-contine informatii despre pagina respectiva;
-contine corpul paginii;
O structura a unei pagini HTML :
<html>
<head>
<title></title>
</head>
<body>
</body>
</html>
Atribute HTML
Atribute
Atributele sunt ca o descriere pentru taguri, ele mereu au nume si o valoare. Un atribut se scrie sub forma: si se introduce in tag sub forma:
Ex: La tagul body putem sa adaugam atributul bgcolor cu valoarea yellow sub form <body bgcolor="yellow"></body>
Daca puneti acest tag in pagina care ati creat-o veti abserva ca pagina are culoarea galben. Tocmai ati schimbat culoarea de fundal.
Atentie , tagul <body> se pune o singura data intr-o pagina, nu de mai multe ori!
Atributul bgcolor schimba fundalul unei pagini. Puteti sa-i dati ca valoare orice culoare in limba engleza. Cum ati vazut si mai sus coluarea yellow din exemplu, in engleza inseamna galben.
Atributul align pozitioneaza un element. Ex: <h1 align="center"> - pune un text antet pe centru
align="center" - aliniaza in centru
align="left" - aliniaza la stanga
align="right" - aliniaza la dreapta
Dupa cum vedeti atibutul si valoarea se adauga se deschide tagul.
De retinut ca un tag poate sa aiba oricate atribute dar unele taguri suporta doar anumite atribute si unule atribute au valori standard.
Text HTML
Text
Textul se poate introduce si fara taguri. Dar daca dorim sa avem un text de o anumita forma atunci in bagam in taguri ca si cele de mai jos:
<font> </font> -intre ele se pune ce vrei sa scrii pe pagina (acest tag nu va schimba deloc forma textului)
<b> </b> -defineste test ingrosat sau- <ingrosat> </ingrosat>
<big> </big> -defineste test mare;
<mic> </mic> -defineste test mic;
<em> </em> -defineste test accentuat;
<i> </i> -defineste test italic;
Anteturi:
HTML adauga automat o linie goala in plus inainte si dupa un antet.
<h1> </h1> -defineste un antet de cea mai mare marime;
<h2> </h2>
<h3> </h3>
<h4> </h4>
<h5> </h5>
<h6> </h6> -defineste antetul de cea mai mica marime;
Tagul <br> este folosit cand doriti sa intrerupeti un rand/linie , dar nu vreti
sa incepeti un nou paragraf , forteaza o rupere de linie oriunde este asezat .
Poate fi folosit pentru a lasa un rand liber . El este nepereche , neavand
nevoie de tag de inchidere .
-este folosit ca spatiu
© -copyright- ©
® -marca inregistrata- ®
<!-- This is a comment --> -cu acest tag se scrie un comentariu in html
source code , comentariu este ignorat de browser , pentru a vedea html
source code apasa click right pe o pagina web si selecteaza "page source" .
Imagini HTML
Imagini
Cu HTML puteti afisa imagini intr-un document. In HTML, imaginile se definesc
cu tagul <img>. Tagul <img> nu are tag de inchidere. Pentru a afisa o
imagine pe o pagina, trebuie sa folositi atributul src. Src inseamna "sursa".
Valoarea acestui atribut este adresa imaginii pe care vreti s-o afisati pe pagina.
URL-ul duce catre locatia unde imaginea este stocata.
<img src="adresa + imagine" alt="">
Atributul alt ii spune celui ce vede pagina ce se afla in locul imaginii daca
browser-ul nu poate incarca imagini.
Link-uri si Ancore
HTML foloseste un hiperlink pentru a se lega de alt document web. HTML
foloseste tagul ancora sau <a> pentru a crea un link catre alt document . O
ancora poate duce catre orice resursa de pe Web: o pagina HTML, o
imagine, un fisier sunet, un film etc .
<a href="url"> Textul ce va fi afisat </a>
Cu atributul target, puteti indica unde sa deschideti documentul catre care
se face link-ul. Linia de mai jos va deschide documentul intr-o noua fereastra
de browser:
<a href= "url" target= "_self" > Textul ce va fi afisat
target= "_self" Incarca noul document in aceeasi fereastra cu ancora (implicit).
target= "_parent" Incarca noul document in cadrul cadrul de baza .
target= "_top" Incarca noul document in intreaga fereastra de browser.
target= "_blank" Incarca noul document intr-o fereastra noua.
Link catre o sectiune:
<a name= "Paragrafele"> Paragrafele </a>(se pune unde este sectiunea pentru a marca)
Mail link:
<a href= "mailto:[email protected]" >Send Mail <a >
Tabele HTML
Tabele
Cu HTML se pot crea tabele. Tabelele se definesc cu tagul <table>.
Un tabel este divizat in randuri (cu ajutorul tagului <tr>) si fiecare rand
este impartit in celule de date (cu ajutorul tagului <td>). Td inseamna
"table data" si este continutul unei celule de date. O celula de date poate
contine text, imagini, liste, paragrafe, formulare, linii orizontale, tabele etc.
<table border="1">
<tr>
<td>randul 1, celula 1 </td>
<td>randul 1, celula 2 </td>
</tr>
<tr>
<td>randul 2, celula 1 </td>
<td>randul 2, celula 2 </td>
</tr>
</table>
randul 1, celula 1 randul 1, celula 2
randul 2, celula 1 randul 2, celula 2
Daca border="0" tabelul va exista dar va avea border-ul invizibil.
Si cu cat nr border-ului va creste border-ul va fi mai ingrosat.
<table>Defineste un tabel.
<th>Defineste o celula cap de tabel.
<tr>Defineste un rand de tabel.
<td>Defineste o celula din tabel.
<captation>Defineste un camp asociat tabelului pentru introducerea unei explicatii.
<colgroup>Defineste grupuri de coloane ale tabelului.
<col>Defineste valorile atributului pentru una sau mai multe coloane dintr-un tabel.
<thead>Defineste un cap de tabel care nu se va derula.
<tbody>Defineste corpul unui tabel care se desfasoara in interiorul
unui cap de tabel fixat si subsolul tabelului.
<tfoot>Defineste un subsol de tabel care nu se va derula.
Liste HTML
Liste
Html suporta liste neordonate si ordonate.
Ex de lista neordonata:
<ul>
<li>element1 </li>
<li>element2 </li>
</ul>
Prin <ul type=""> semnul din fata poate fi modificat.
<ul type="disc"> , <ul type="circle"> , <ul type="square">
Ex de lista ordonata:
<ol>
<li>element1 </li>
<li>element2 </li>
</ol>
Initial in fata va aparea 1. , 2. .Prin
type"A" se va schimba in A. , B. , C. ,etc.
type"a" se va schimba in a. , b. , c. ,etc.
type"I" se va schimba in I. , II. , III. ,etc.
type"i" se va schimba in i. , ii. , iii. ,etc.
Cadre HTML
Cadre
Cu ajutorul cadrelor, se poat afisa mai multe pagini web in aceeasi fereastra
de browser. Fiecare document HTML poarta numele de cadru (frame) si fiecare
cadru este independent de celelalte.
<frameset cols="30%,70%">
<frame src="pagina1 name="left">
<frame src="pagina2 name="right">
</frameset>
<frameset> Defineste un set de cadre.
<frame> Defineste o sub-fereastra (un cadru).
<noframes> Defineste o sectiune noframei.
<iframe> Defineste o sub-fereastra inline.
Formulare HTML
Formulare
Formularele HTML sunt folosite pentru a selecta diferite moduri de introducere a datelor de catre utilizator. Se pot introduce informatii ca: (campuri text, meniuri ce se pot derula, butoane radio, casute de validare, etc.).
Un formular se defineste cu tagul <form>.
Text:
<form>
Nume: <input type="text" name="nume">
<br>
Prenume: <input type="text" name="prenume">
</form>
Radio buton:
<form>
<input type="radio" name="sex" value="male"> Male
<br>
<input type="radio" name="sex" value="female"> Female
</form>
Checkbox:
<form>
Am un caine:
<input type="checkbox" name="animal" value="caine">
<br>
Am o pisica:
<input type="checkbox" name="animal" value="pisica">
</form>
Formular cu actiune:
<form name="input" action="html.php" method="get">
Username:
<input type="text" name="user">
<input type="submit" value="Submit">
</form>
Sursa:lucian0308.com
Tutorial instalare phpBB/Joomla/Php-Fusion si HTML(folosire)
Moderators: Moderatori ajutatori, Moderatori
- MCosti
- Fost moderator
- Posts: 2251
- Joined: 28 Sep 2008, 06:58
- Detinator Steam: Da
- Reputatie: Membru Club eXtreamCS (2 luni)
Fost moderator
Nume anterior: DjMax - Has thanked: 139 times
- Been thanked: 60 times
- Contact:
Last edited by Anonymous on 30 Sep 2008, 05:25, edited 1 time in total.
Reason: fi te rog mai atent cand postezi 8-|
Reason: fi te rog mai atent cand postezi 8-|
-
- Membru, skill 0
- Posts: 42
- Joined: 03 Aug 2007, 15:43
- Detinator Steam: Nu
- Location: Timisoara
- Contact:
-
- Information
-
Who is online
Users browsing this forum: Bing [Bot], Doctor whO? <3, Dot [Bot], Google [Bot], Mădălin, Petal [Bot], Yandex [Bot] and 434 guests