HTML
Tradus de
ScribdTranslationsHTML
Tradus de
ScribdTranslationsHTML
DFT3013
Tehnologii de Design Web
Creează pagină web
folosind HTML
HTML
LO
Creează o pagină web folosind HTML –Aplică tag-ul BODY cu Bgcolor,
–Describe HTML Aplică fundal cu imagine ș i text
–Defini ț i limbajul de marcare culoare.
–Identifică structura HTML –Identificare
document: –IdentifyText attributes
-a. <html> –Etichete de titlu (H1–H6)
–b. <cap>
–c. <titlu> Text cu bandă rulantă cu sau fără
background, Blink the text attributes
–d. <body>
–Explică sec ț iunea Head ș i utilizarea acesteia –Împarte sec ț iunea folosind linia <HR> cu
width, align, size
elemente
-a. Meta etichete –Creează un fi ș ier HTML simplu.
-b. etichete de linkuri externe
Ce este HTML?
. HTML este limbajul standard de marcare pentru crearea paginilor web.
. HTML înseamnă Limbaj de Marcaj Hyper Text
. HTML descrie structura paginilor Web folosind markup
. Elementele HTML sunt blocurile de construcț ie ale paginilor HTML
. Elementele HTML sunt reprezentate prin etichete
. Etichetele HTML etichetează piese de conț inut, cum ar fi "titlu", "paragraf", "tabel"
ș i aș a mai departe
. Browserele nu afiș ează etichetele HTML, ci le folosesc pentru a reda conț inutul.
al paginii
Limbaj de marcare
–Limbile de marcare sunt concepute pentru procesarea, defini ț ia ș i
prezentarea textului. Limbajul specifică codul pentru formatare, atât cât ș i
formatul ș i stilul, într-un fiș ier text. Codul utilizat pentru a specifica formatarea
se numesc etichete. HTML este un exemplu de un markup bine cunoscut ș i utilizat
limbaj.
Etichete HTML
–Etichetele HTML sunt nume de elemente înconjurate de unghiuri:
<tagname>content goes here...</tagname>
Etichetele HTML vin de obicei în perechi, cum ar fi <p> ș i </p>
Primul eticheta dintr-o pereche este eticheta de început, a doua eticheta este eticheta de sfâr ș it
–Eticheta de închidere este scrisă la fel ca eticheta de început, dar cu o bară oblică adăugată.
înainte de numele etichetei
–Tip: Eticheta de început este de asemenea numită eticheta de deschidere, iar eticheta de sfâr ș it eticheta de închidere
etichetă.
<html>
<body>
<h1>Aceasta este Titlul Principal</h1>
<p>Acest text ar putea fi o introducere la restul
pagina. Ș i dacă pagina este una lungă, ar putea
fie împărț it în mai multe subcapitole.
<h2>Aceasta este o Sub-Întrebare</h2>
<p>Multe articole lungi au subtitluri pentru a ajuta
urmezi structura a ceea ce este scris.
Ar putea exista chiar sub-subcapitole (sau niveluri inferioare
meniuri).
<h2>Un alt subtitlu</h2>
<p>Aici puteț i vedea un alt subcapitol.</p>
</body>
</html>
Structura paginii HTML
Secț iunea head ș i elementele sale
–HTML î ț i permite să specifici metadate - informa ț ii suplimentare importante despre un
documentul în diferite moduri. Elemente META pot fi folosite pentru a include
perechi nume/valoare care descriu proprietăț ile documentului HTML, cum ar fi
author, expiry date, a list of keywords, document author etc.
Tag-ul <meta> este folosit pentru a oferi astfel de informa ț ii suplimentare. Acest tag este un
element gol ș i, prin urmare, nu are un tag de închidere, dar poartă informaț ii
în cadrul atributelor sale.
Adăugarea Meta Tag-urilor la
Documente
Poț i adăuga metadate paginilor tale web plasând etichete <meta>
în interiorul antetului documentului care este reprezentat de
<head>ș i</head>tag-uri. Un tag meta poate avea următoarele
atribute în plus faț ă de atributele de bază:
Exemplu
–Define caracterul set utilizat:
–<meta charset="UTF-8">
–Defineste o descriere a paginii tale web:
–<meta name="description" content="Free Web tutorials">
–Definirea cuvintelor cheie pentru motoarele de căutare:
–<meta name="keywords" content="HTML, CSS, XML, JavaScript">
–Define autorul unei pagini:
–<meta name="author" content="John Doe">
–Reîmprospătează documentul la fiecare 30 de secunde:
–<meta http-equiv="refresh" content="30">
Etichete de link externe
Tag-ul <link> define ș te un link între un document ș i o resursă externă.
Tag-ul <link> este folosit pentru a lega foi de stil externe.
<head>
<link rel="stylesheet" type="text/css" href="[Link]">
</cap>
–Notă: Elementul <link> este un element gol, con ț ine doar atribute.
–Notă: Acest element se află doar în sec ț iunea head, dar poate apărea oriunde.
numărul de ori.
Declaraț ia <!DOCTYPE>
–Declara ț ia <!DOCTYPE> reprezintă tipul documentului ș i ajută
browsere pentru a afiș a corect paginile web.
Trebuie să apară o singură dată, în partea de sus a paginii (înainte de orice etichete HTML).
Declara ț ia <!DOCTYPE> nu este sensibilă la majuscule.
Declara ț ia <!DOCTYPE> pentru HTML este:
–<!DOCTYPE html>
Versiuni HTML
Editoare HTML
–Step 1: Open Notepad (PC)
Windows 8 sau mai recent:
–Deschide Ecranul de Start (simbolul feronerie la fereastră)
în colț ul din stânga jos al ecranului tău). ScrieNotepad.
–Windows 7 sau versiuni anterioare:
–DeschideStart>Programe > Accesorii > Notepad
–Pasul 2: Scrie ț i ceva HTML
–Scrie sau copiază ni ș te HTML în Notepad.
–<!DOCTYPE html>
<html>
<body>
<h1>Primul Meu Titlu</h1>
<p>Primul meu paragraf.</p>
</body>
</html>
–Pasul 3: Salvează pagina HTML
Salva ț i fi ș ierul pe computerul dumneavoastră. Selecta ț i Fi ș ier > Salva ț i ca în meniul Notepad.
–Nume ș te fi ș ierul "[Link]" ș i setează codificarea la UTF-8 (care este
codificarea preferată pentru fiș ierele HTML).
Puteț i folosi fie .htm
sau .html ca fiș ier
extensie. Nu există
diferenț ă, depinde de
tu.
–Pasul 4: Vizualiza ț i pagina HTML în browserul dumneavoastră
–Deschide ț i fi ș ierul HTML salvat în browserul dumneavoastră preferat (face ț i dublu clic pe fi ș ier,
sau faceț i clic dreapta - ș i alegeț i "Deschideț i cu".
Rezultatul va arăta foarte asemănător cu acesta:
eticheta <body>
Tag-ul <body> defineș te corpul documentului.
Elementul <body> conț ine toate conț inuturile unei
document HTML, cum ar fi text, hyperlinkuri, imagini,
mese, liste, etc.
HTML <body> atribut bgcolor
Atributul bgcolor specifică culoarea de fond a unui document.
Atributul bgcolor al <body> nu este acceptat în HTML5. Folosi ț i CSS în schimb.
–CSS syntax: <body style="background-color:#E6E6FA">
–Sintaxă
-<body bgcolor="culoare_nume|hex_număr|rgb_număr">
Atributul bgcolor în HTML <body>
Metode de codificare a culorilor HTML
–Există următoarele trei metode diferite de a seta culorile în pagina ta web:
–Numele culorilor -Pute ț i specifica direct numele culorilor precum verde, albastru sau ro ș u.
Coduri Hex - Un cod cu ș ase cifre care reprezintă cantitatea de ro ș u, verde ș i albastru
care formează culoarea.
–Culoare valori decimale sau procentuale -Această valoare este specificată folosind rgb( )
proprietate.
[Link]
Exemplu
fundal HTML <body>
Atribut
Atributul de fundal specifică o imagine de fundal pentru un document.
Atributul de fundal <body> nu este suportat în HTML5. Folose ș te CSS
în schimb.
–Sintaxă CSS: <body style="background-image:url([Link])">
–Sintaxă
–<body background="URL">
HTML <body> fundal
Atribut
Formatarea textului HTML
HTML define, de asemenea, elemente speciale pentru a defini texte cu o semnifica ț ie specială.
HTML folose ș te elemente precum <b> ș i <i> pentru formatarea ie ș irii, precum îngro ș at sau italic.
text.
Elementele de formatare au fost concepute pentru a afi ș a tipuri speciale de text:
<b> - Text îngro ș at
–<strong> - Text important
-<i> - Text italic
-<em> - Text subliniat
–<mark> - Text marcat
-<small> - Text mic
–<del> - Text eliminat
–<ins> - Text adăugat
-<sub> - Text subscript
–<sup> - Text în superscript [Link]
Etichete de titlu (H1–H6)
Etichetele <h1> până la <h6> sunt folosite pentru a defini titlurile HTML.
<h1> define ș te cel mai important titlu. <h6> define ș te cel mai pu ț in important
titlu.
Motoarele de căutare folosesc titlurile pentru a indexa structura ș i con ț inutul site-ului tău.
pagini.
Utilizatorii rasfoiesc paginile tale după titluri. Este important să folose ș ti titluri pentru a arăta...
structura documentului.
–<h1> titlurile ar trebui să fie folosite pentru titlurile principale, urmate de <h2> titluri,
apoi mai puț in important <h3>, ș i aș a mai departe.
–Notă: Folosi ț i titluri HTML doar pentru titluri. Nu folosi ț i titluri pentru a face textul MARE.
orbold.
Etichete de titlu (H1–H6)
<h1>Asta este titlul 1</h1>
<h2>Aceasta este titlul 2</h2>
<h3>Aceasta este titlul 3</h3>
<h4>Aceasta este titlul 4</h4>
<h5>Aceasta este titlul 5</h5>
Aceasta este titlul 6
Text de tip marquee cu sau fără
background, Blink the text
atribute
O altă etichetă non-standard care poate fi la fel de enervantă ca eticheta <blink> este
. Acest lucru poate fi folosit pentru a crea un efect de text în miș care, similar cu unele
semne LED de tip "matrice" ș i iluminate.
–<marquee behavior="scroll" bgcolor="#00CCCC" loop="-1"
lăț ime="40%">Demonstrarea unei etichete Marquee.</marquee>
–<blink> ... </blink>
–Plasa ț i în jurul textului pentru a-l face să lumineze.
<HR> linie cu lăț ime, aliniere, dimensiune
Tag-ul <hr> define ș te o pauză tematică într-o pagină HTML (de exemplu, o schimbare de subiect).
Elementul <hr> este folosit pentru a separa con ț inutul (sau a defini o schimbare) într-un
Pagina HTML.
În HTML5, eticheta <hr> define ș te o rupere tematică.
În HTML 4.01, eticheta <hr> reprezintă o regulă orizontală.
–Cu toate acestea, eticheta <hr> poate fi în continuare afi ș ată ca o linie orizontală în vizual.
butoane, dar acum este definit în termeni semantici, mai degrabă decât prezentanț i
termeni.
Toate atribu ț iile de layout sunt eliminate în HTML5. Folose ș te CSS în schimb.
<HR> linie cu lăț ime, aliniere, dimensiune
Hyperlink-uri
HTML
LO
Hyperlinkuri
–Folose ș te eticheta <a> pentru a face legătura:
–a. în cadrul unei pagini
între pagini
Hyperlinkuri
Linkurile sunt caracteristica definitorie a web-ului deoarece î ț i permit să te mu ț i
de la o pagină web la alta - facilitând chiar ideea de navigare sau
surfing.
Ve ț i întâlni în mod obi ș nuit următoarele tipuri de linkuri:
–Linkuri de la un site web la altul
–Linkuri de pe o pagină pe alta în acela ș i site web
–Linkuri de la o parte a unei pagini web la o altă parte a acelea ș i pagini
–Link-uri care se deschid într-o nouă fereastră de browser
–Linkuri care deschid programul tău de email ș i adresează un email nou cuiva
<a> etichetă
–Un link este specificat folosind eticheta HTML <a>. Această etichetă se nume ș te etichetă de ancoră ș i
orice lucru între eticheta de deschidere <a> ș i eticheta de închidere </a> devine parte
al linkului ș i un utilizator poate face clic pe acea parte pentru a ajunge la documentul legat.
Următoarea este sintaxa simplă pentru a folosi tag-ul <a>.
–<a href="Document URL" ... attributes-list>Textul linkului</a>
Scrierea linkurilor
Linkurile sunt create folosind elementul <a>. Utilizatorii pot face clic pe orice
între eticheta de deschidere <a> ș i eticheta de închidere </a>. Specifici
ce pagină doreș ti să leagă folosind atributul href.
Link către alte site-uri
Lista politehnicelor:
<ul>
<li><a href="[Link]
PSP</a></li>
<li><a href="[Link] </a></li>
PUO</a></li>
<li><a href="[Link] ">
PTSD</a></li>
<li><a href="[Link]
POLIMAS
</ul>
</p> Când te conectezi la un alt site web,
valoarea atributului href va fi întreaga
adresa web pentru site-ul, care este cunoscut
ca un URL absolut.
Legarea la alte pagini pe
Acelaș i site
<p>
<ul>
<li><a href="[Link]">Acasă</a></li>
<li><a href="[Link]">Despre</a></li>
<li><a href="[Link]">Filme</a></li>
<li><a href="[Link]">Contact</a></li>
</ul> Când faceț i legătura către alte pagini din interiorul
acelaș i site, nu trebuie să specifici
</p> numele de domeniu în URL. Puteț i folosi un
abrevial cunoscut sub numele de URL relativ.
Legarea la o parte specifică a
Aceeaș i pagină
<h1 id="top">Termeni de filmare</h1>
<a href="#arc_shot">Foc cu arc</a><br />
<a href="#interlude">Interludiu</a><br />
<a href="#prolog">Prolog</a><br /><br />
<h2 id="arc_shot">Arc Shot</h2>
<p>O fotografie în care subiectul este surprins de un
camera care înconjoară sau se miș că
<h2 id="interlude">Interlude</h2>
<p>O scurtă scenă sau secvenț ă de film intervenantă, nu
legat în mod specific de intrigă, care apare
într-un film
<h2 id="prologue">Prologue</h2>
<p>Un discurs, o prefaț ă, o introducere sau o scenă scurtă
precedând acț iunea principală sau trama unui film;
contrast cu epilogul
<p><a href="#top">Sus</a></p>
Linkuri HTML - Ținta
Atribut
Atributul target specifică unde să se deschidă documentul legat.
Atributul target poate avea una dintre următoarele valori:
–_blank - Deschide documentul legat într-o fereastră sau tab nou
–_self - Deschide documentul linkat în aceea ș i fereastră/tab în care a fost făcut clic
(acesta este implicit)
–_parent - Deschide documentul asociat în cadrul părinte
–_top - Deschide documentul legat în întreaga fereastră
–framename - Deschide documentul asociat într-un cadru numit
Exemplu
<!DOCTYPE html>
<html>
<head>
<title>Hyperlink Example</title>
</head>
<body>
<p>Click any of the following links</p>
<a href="[Link]" target="_blank">Se deschide în
Nou
<a href="[Link]" target="_self">Se deschide în sine</a> |
<a href="[Link]" target="_parent">Se deschide în
Părinte</a> |
<a href="[Link]" target="_top">Se deschide în corp</a>
</body>
</html>
Exemplu
HiDAAHM | IUN2017
Masă
HTML
LO
Masă
–Seta ț i culoarea tabelului ș i a celulelor.
–Umplerea celulelor, marginea tabelului ș i distan ț a dintre celule.
–Alinia ț i textul în celule (orizontal, vertical).
Seta ț i spanul coloanei ș i al rândului.
Tabel
–O masă reprezintă informa ț ii într-un format de tip grilă.
Exemple de tabele includ rapoarte financiare, programe TV ș i rezultate sportive.
Grilele ne permit să în ț elegem date complexe în referin ț ă la informa ț ii despre două
axe.
Fiecare bloc din grilă este denumit celulă a tabelului. În HTML, un tabel este scris
rând cu rând.
Exemplu
Anteturile tabelei
Elementul <th> este folosit exact ca <td>
element, dar scopul său este de a reprezenta
antet pentru o coloană sau un rând. (The th
reprezintă titlul tabelului.)
Browserele de obicei afiș ează conț inutul unui <th>
element în bold ș i în mijlocul celulei.
Fundaluri pentru mese
–Pute ț i seta fundalul tabelului folosind una dintre cele două moduri următoare:
–atribut bgcolor - Pute ț i seta culoarea de fundal pentru întreaga tabelă sau doar pentru
o celulă.
–atributdefundal - Pute ț i seta imaginea de fundal pentru întreaga tabelă sau doar
pentru o celulă.
De asemenea, po ț i seta culoarea border-ului folosind atributul bordercolor.
Fundaluri de mese
<!DOCTYPE html>
<html>
<head>
<title>HTML Table Background</title>
</head>
<body>
<table border="1" bordercolor="verde" bgcolor="galben">
<tr>
<th>Coloana 1</th>
<th>Coloana 2</th>
<th>Coloana 3</th>
</tr>
<tr><td rowspan="2">Rând 1 Celula 1</td><td>Rând 1 Celula 2</td><td>Rând 1 Celula 3</td></tr>
<tr><td>Row 2 Cell 2</td><td>Row 2 Cell 3</td></tr>
<tr><td colspan="3">Rând 3 Celula 1</td></tr>
</tabel>
</corp
</html>
Fundaluri pentru mese
<!DOCTYPE html>
<html>
<head>
<title>HTML Table Background</title>
</head>
<body>
<table border="1" bordercolor="green" background="/images/[Link]">
<tr>
<th>Coloana 1</th>
<th>Coloana 2</th>
<th>Column 3</th>
</tr>
<tr><td rowspan="2">Rând 1 Celula 1</td><td>Rând 1 Celula 2</td><td>Rând 1 Celula
3</td></tr>
<tr><td>Row 2 Cell 2</td><td>Row 2 Cell 3</td></tr>
<tr><td colspan="3">Rând 3 Celula 1</td></tr>
</table>
</body>
</html>
Cellpadding and Cellspacing
Atribute
Există două atribute numite cellpadding ș i cellspacing pe care le vei
folosiț i pentru a ajusta spaț iul alb în celulele tabelului dvs.
Atributul cellspacing define ș te lă ț imea marginii, în timp ce cellpadding
reprezintă distanț a dintre marginile celulei ș i conț inutul din interiorul unei celule.
Exemplu
<!DOCTYPE html>
<html>
<cap>
<title>HTML Table Cellpadding</title>
</head>
<body>
<table border="1" cellpadding="5" cellspacing="5">
<tr>
<th>Nume</th>
<th>Salary</th>
</tr>
<tr>
<td>Ramesh Raman</td>
<td>5000</td>
</tr>
<tr>
<td>Shabbir Hussein</td>
<td>7000</td>
</tr>
</table>
</body>
</html>
Colspan ș i Rowspan
Atribute
–Ve ț i folosi atributul colspan dacă dori ț i să fuziona ț i două sau mai multe coloane în
o singură coloană. Într-un mod similar, vei folosi rowspan dacă vrei să îmbini două
sau mai multe rânduri.
Exemplu
<!DOCTYPE html>
<html>
<head>
<title>HTML Table Colspan/Rowspan</title>
</cap>
<body>
<table border="1">
<tr>
<th>Coloana 1</th>
<th>Coloana 2</th>
<th>Coloana 3</th>
</tr>
<tr><td rowspan="2">Rând 1 Celula 1</td><td>Rând 1 Celula 2</td><td>Rând 1 Celula
3</td></tr>
<tr><td>Row 2 Cell 2</td><td>Row 2 Cell 3</td></tr>
<tr><td colspan="3">Rând 3 Celula 1</td></tr>
</table>
</body>
</html>
Atributul align <tr> HTML
Atributul align specifică alinierea orizontală a con ț inutului într-un tabel
rând.
Atributul align al <tr> nu este suportat în HTML5. Folose ș te CSS în schimb.
-Sintaxa CSS: <tr style="text-align:dreapta">
–Sintaxă
–<tr align="stânga|dreapta|centru|justificat|caracter">
Atributul align al <tr> HTML
Exemplu
<tabel>
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr align="dreapta">
<td>Ianuarie</td>
<td>$100</td>
</tr>
</table>
Rame
HTML
HiDAYAHM | IUN2017
LO
–Cadru ș i set de cadre.
–Proprietă ț i de cadru ș i set de cadre.
–Tehnica designului cadrului.
–Crearea cadrelor.
Cadrul
–Frame-urile HTML sunt folosite pentru a împăr ț i fereastra browserului tău în mai multe sec ț iuni
unde fiecare secț iune poate încărca un document HTML separat.
O colec ț ie de cadre în fereastra browserului este cunoscută sub numele de set de cadre.
fereastra este împărț ită în cadre într-un mod similar în care sunt organizate tabelele: în
rânduri ș i coloane.
Crearea ramelor
Pentru a folosi cadre pe o pagină, folosim eticheta <frameset> în loc de eticheta <body>.
Tagul <frameset>defineș te cum să împărț im fereastra în cadre.
Atributul rows al etichetei <frameset> define ș te cadrele orizontale ș i cols
atributul defineș te cadre verticale.
Fiecare cadru este indicat prin eticheta <frame> ș i define ș te care document HTML
se va deschide în cadrul.
Exemplu
<!DOCTYPE html>
<html>
<head>
<title>HTML Frames</title>
</cap>
<frameset rows="10%,80%,10%">
<frame name="top" src="/html/top_frame.htm" />
<frame name="principal" src="/html/cadru_principal.htm" />
<frame name="bottom" src="/html/bottom_frame.htm" />
<noframes>
<corp>
Browserul tău nu suportă frame-uri.
</body>
</noframes>
</frameset>
</html>
Exemplu
<!DOCTYPE html>
<html>
<cap>
<title>HTML Frames</title>
</head>
<frameset cols="25%,50%,25%">
<frame name="left" src="/html/top_frame.htm" />
<frame name="center" src="/html/main_frame.htm" />
<frame name="dreapta" src="/html/bottom_frame.htm" />
<noframes>
<body>
Browserul tău nu suportă cadre.
</body>
</noframes>
</frameset>
</html>
Set de cadre
Atributele etichetei
Cadru
Atribute de etichetă
Design de cadru
<!DOCTYPE html>
<html>
<head>
<title>HTML Target Frames</title>
</cap>
<frameset cols="200, *">
<frame src="/html/[Link]" name="menu_page" />
<frame src="/html/[Link]" name="main_page" />
<noframes>
<corp>
Browser-ul tău nu suportă cadre.
</body>
</noframes>
</frameset>
</html>
Design cadrul
<!DOCTYPE html>
<!DOCTYPE html>
<html>
<html>
<body bgcolor="#4a7d49">
<body bgcolor="#b5dcb3">
<a href="[Link]
<h3>Aceasta este pagina principală ș i conț inutul din orice</h3>
target="main_page">Google</a>
linkul va fi afiș at aici.</h3>
<br /><br />
<p>Deci acum faceț i clic pe orice link ș i vedeț i
<a href="[Link]
rezultat.</p>
target="main_page">Microsoft</a>
</body>
<br /><br />
</html>
<a href="[Link]
BBC News
</corp>
</html>
ț intă
Forme într-o pagină web
HTML
HiDAYAHM | IUN2017
LO
–Forme etichete ș i atribute.
–metoda POST ș i GET
–Unelte pentru formulare:
–a. casetă de text
–b. buton radio
–c. casetă combinată
–d. zona de text
-e. butonul de trimitere
–f. buton de reset
–g. câmp de încărcare a fi ș ierelor
–h. câmp de text ascuns
–i. câmp de text pentru parolă
–Crearea unui formular web complet
Etichete ș i atribute pentru formulare
Elementul HTML <form> define ș te un formular care este utilizat pentru a colecta inputul utilizatorului:
<form action="URL Script" method="GET|POST">
elemente de formular precum input, textarea etc.
</form>
–Un formular HTML con ț ine elemente de formular.
Elementele de formular sunt diferite tipuri de elemente de input, cum ar fi câmpurile de text,
casete de selectare, butoane radio, butoane de trimitere ș i altele.
Metode GET ș i POST
Există două moduri în care clientul browser poate trimite informa ț ii serverului web.
Metoda GET
–Metoda POST
Înainte ca browserul să trimită informa ț ia, o codifică folosind un sistem numit
Codificarea URL.
În acest sistem, perechile nume/valoare sunt legate cu semne de egalitate, iar perechile diferite sunt
separate de ampersand.
-name1=val1&name2=val2&name3=val3
-Spa ț iile sunt eliminate ș i înlocuite cu caracterul + ș i orice alt caracter non-alfanumeric
caracterele sunt înlocuite cu valori hexadecimale.
După ce informa ț ia este codificată, aceasta este trimisă către server.
Metoda GET
Metoda GET trimite informa ț iile codificate ale utilizatorului ata ș ate cererii paginii.
Pagina ș i informaț iile codificate sunt separate prin caracterul?
– [Link]
Metoda GET produce un ș ir lung care apare în jurnalele serverului tău, în
câmpul de locaț ie al browser-ului.
Metoda GET este restric ț ionată la trimiterea a maximum 1024 de caractere.
–Nu folosi ț i niciodată metoda GET dacă ave ț i o parolă sau alte informa ț ii sensibile.
trimis la server.
GET nu poate fi folosit pentru a trimite date binare, cum ar fi imagini sau documente Word, către
server.
Datele trimise prin metoda GET pot fi accesate folosind variabila de mediu QUERY_STRING
variabilă.
PHP oferă un array asociativ $_GET pentru a accesa toate informa ț iile trimise utilizând
Metoda GET.
Exemplu
<?php
dacă( $_GET["name"] || $_GET["age"] ) {
Bine ai venit
Ai
ieș ire();
}
?>
<html>
<body>
<form action = "<?php $_PHP_SELF ?>" method = "GET">
Nume: <input type = "text" name = "name" />
Vârstă: <input type = "text" name = "age" />
<input type = "submit" />
</form>
</body>
</html>
Metoda POST
Metoda POST transferă informa ț ii prin intermediul anteturilor HTTP. Informa ț ia este
codificat aș a cum este descris în cazul metodei GET ș i pus într-un antet numit
Ș IR_DE_INTEROGARE.
Metoda POST nu are nicio restric ț ie cu privire la dimensiunea datelor care pot fi trimise.
Metoda POST poate fi folosită pentru a trimite atât date ASCII, cât ș i date binare.
Datele trimise prin metoda POST trec prin antetul HTTP, astfel că securitatea depinde de
Protocolul HTTP. Folosind HTTP securizat, te poț i asigura că informaț iile tale sunt
sigur
PHP oferă un array asociativ $_POST pentru a accesa toate informa ț iile trimise utilizând
Metoda POST.
Exemplu
<?php
dacă( $_POST["nume"] || $_POST["vârstă"] ) {
dacă (preg_match("/[^A-Za-z'-]/",$_POST['name'] )) {
morț i ("nume invalid ș i numele ar trebui să fie alpha");
}
Bine ai venit
Ai
ieș ire();
}
?>
<html>
<body>
<form action = "<?php $_PHP_SELF ?>" method = "POST">
Name: <input type = "text" name = "name" />
Vârstă: <input type = "text" name = "age" />
<input type = "submit" />
</form>
</body>
</html>
O formă poate avea mai multe controale de formă,
fiecare întâlnire adună informaț ii diferite.
Serverul trebuie să ș tie ce piesă
datele introduse corespund cu
care element de formă.
Formular
–Un formular web este o colecț ie de casete de text, liste, butoane ș i alte
widget-uri clicabile pe care un utilizator de internet le foloseș te pentru a furniza un anumit tip de
informaț ii pentru un site web.
Formele sunt peste tot pe web - ele îț i permit să te înregistrezi pentru email
conturi, revizuirea produselor ș i efectuarea tranzacț iilor bancare.
Cea mai simplă formă posibilă este caseta de text unică care împodobeș te
motoare de căutare precum Google.
Instrumente de formular:
[Link]
[Link]
[Link]
c. casetă de text
–b. buton radio
-c. caseta combinată
–d. zonă de text
-e. buton de trimitere
–f. buton de reset
-g. câmp de încărcare fi ș ier
–h. câmp de text ascuns
–i. câmp de text pentru parolă
Exemplu
<form action="#"> <td><input type="parolă" name="parolă"
<tabel> id="register_password" style="width:160px"/></td>
<tr> </tr>
<td class="tdLabel"><label for="register_name"> <tr>
class="label">Introdu numele:</label></td> <td class="tdLabel"><label for="register_email"
<td><input type="text" name="name" value="" clas="label">Introduceti Email:</label></td>
id="register_name" style="width:160px"/></td> <td
</tr> <input type="email" name="email" value=""
<tr> id="register_email" style="width:160px"/></td>
<td class="tdLabel"><label for="register_password" </tr>
introduceț i parola:
Exemplu
<tr> <td><select name="ț ara" id="register_country"
<td class="tdLabel"><label for="register_gender" style="width:160px">
clasa="eticheta">Introduceti sexul:</eticheta></td> <option value="india">india</option>
<td> <option value="pakistan">pakistan</option>
<input type="radio" name="gen" <option value="africa">africa</option>
id="register_gendermale" value="male"/> <option value="china">china</option>
<label for="register_gendermale">male</label> <option value="other">other</option>
<input type="radio" name="gen" </select>
id="register_genderfemale" value="female"/> </td>
<label for="register_genderfemale">female</label> </tr>
</td> <tr>
</tr> <td colspan="2"><div align="right"><input
<tr> type="submit" id="register_0" value="register"/>
<td class="tdLabel"><label for="register_country" </div></td>
class="label">Selectaț i ț ara:</label></td> </tr>
</table>
</form>