[Tutorial HTML] Atributele si tipurile tagului input

#1
Nume Tutorial: Atributele si tipurile tagului input
Descriere: Atributele si tipurile tagului input
Download:
Autor: Anonim
Sursa (Link-ul oficial):
tutorialeonline
Propria parere: Folositor.
Tutorialul:

Tag-ul <input> reprezintă un câmp unde utilizatorul poate adăuga date. Acest tag nu are echivalent de închidere, finalul acestuia se stabileşte cu semnul ">".
Exemplu :
<input name="exemplu">

IN XHTML acest tag trebuie inchis cu "</input>".
I. Tag-ul input este de mai multe tipuri.

1.Text
Defineşte un câmp/linie unde utilizatorul poate adăuga un text oarecare.
Exemplu: <input type="text">


2.Password
Defineşte un câmp unde va fi adaugata o parola/text confidenţial.
Exemplu: <input type="password">


3.Checkbox
Defineşte o căsuţă de selectare. Utilizatorul poate alege una, mai multe sau nici o variantă.
Exemplu:
<input type="checkbox" name="masina" value="Mazda"> Mazda
<input type="checkbox" name="masina" value="Audi"> Audi


Audi
Mazda

4.Radio
Defineşte butonul Radio. Dacă sunt mai multe butoane radio şi au specificat acelaşi nume (name="ceva") se numesc grup de butoane radio iar utilizatorul poate alege o singură variantă dintre ele. Dacă sunt mai multe butoane radio dar cu nume diferit, atunci utilizatorul poate alege sa le bifeze pe toate sau pe niciunul.
Exemplu:
<input type="radio" name="varsta" value="18+"> 18+
<input type="radio" name="varsta" value="-18"> -18

Rezultat:
18+
-18

5.Submit
Un buton de trimitere este folosit pentru a trimite datele din formular către un anume server care le stochează şi se ocupă mai departe de aceste date.
Exemplu:
<input type="submit" value="trimite" name="trimite">

Rezultat:


Butoanele mai pot fi şi de reset, caz în care, toate valorile introduse de vizitator se resetează. Butonul mai poate fi şi de tip imagine, caz în care trebuie specificată o imagine sursa.
Exemplu de buton tip imagine:
<input type="image" name="trimite" src="calea/catre/poza">


Aici sunt toate tipurile tag-ului input (inclusiv cele pentru html5):

button
checkbox
color
date
datetime
datetime-local
email
file
hidden
image
month
number
password
radio
range
reset
search
submit
tel
text
time
url
week


II.Tag-ul input are mai multe atribute.

1.Placeholder
Atributul placeholder arată într-un câmp un text scurt, indiciu despre ceea ce trebuie scris în el, dar nu neapărat. Acest text va dispărea odată ce începeţi să adăugaţi text acelui câmp.
Exemplu:
<input type="text" placeholder="un text oarecare">

Rezultat:

2.Size
Atributul size are rolul de a seta lungimea vizuală a unui câmp. Numărul atribuit acestui atribut reprezintă numărul de caractere care se pot vedea în câmp simultan. Exemplu:
<input type="text" size="30">

Rezultat:

3.Maxlength
Atributul maxlength are rolul de a seta maximul de caractere care pot fi scrise într-un câmp. Este diferit de atributul size deoarece acest atribut are rolul de a seta maximul de caractere permise, pe când size setează lăţimea câmpului.
Exemplu:
<input type="text" maxlegth="7">

Rezultat:

Din câte puteţi vedea nu se pot adăuga mai mult de 7 caractere, maximul setat în cod.

4.Required
Dacă tag-ul input va avea acest atribut, atunci utilizatorul va fi nevoit să completeze câmpul înainte de al trimite (devine câmp obligatoriu de completat).

5.Accept
În cazul unui formular de trimitere fişiere acest atribut permite doar încărcarea fişierelor specificate în acest atribut pe server. În cazul browserelor care nu suportă HTML5, acest atribut este ignorat. În acest caz va trebui să se facă o verificare a tipului fişierului încărcat pe parte de server. Formatul trebuie să fie în varianta standard mime_type (unele browsere detectează diferit mime type-ul la anumite fişiere, de obicei IE e mai diferit faţă de restul).

6.Align
-Top -Bottom
-Left -Right
Atributul align nu este încă suportat de către toate browserele HTML5, specifică alinierea unei imagini. Se poate folosi doar pentru tipul image (<input type="image">).

7.Alt
Se foloseste ca valoare alternativă pentru tagul tip imagine (buton imagine).
Atributul alt furnizează un text alternativ pentru utilizator, în cazul în care, pentru un motiv oarecare, browserul nu poate reda imaginea specificată (din cauza conexiunii lente, o eroare în atributul src, sau în cazul în care utilizatorul folosește un browser text bazed).

8.Autocomplete
Atributul autocomplete specifică dacă un câmp de intrare va putea fi auto-completat.
Autocomplete permite browser-ul să sugereze o valoare. Atunci când un utilizator începe să scrie într-un câmp, browser-ul ar trebui să afișeze opțiuni pentru acel câmp, bazate pe valori scrise de utilizator anterior. Valorile care le poate lua sunt "on" sau "off".

9.Form
Specifică al cărui form aparţine câmpul respectiv (în cazul în care sunt mai multe formulare pe pagină şi acel camp este în afara formularului).

10.Formaction
Specifică URL-ul fișierului, care va procesa controlul de intrare atunci când se depune formularul (de tip = "submit" și de tip = "image")

Mai sunt şi alte tipuri şi atribute ale tag-ului input dar acestea sunt unele din cele mai folosite de către programatori. Unele atribute şi tipuri nu sunt compatibile cu HTML4 deoarece au fost adăugate odată cu HTML5 şi invers, sunt unele atribute care au fost scoase odata cu apariţia HTML5.
- See more at: http://www.tutorialeonline.net/ro/artic ... H1TF2.dpuf

Înapoi la “Tutoriale HTML”

Cine este conectat

Utilizatori răsfoind acest forum: Niciun utilizator înregistrat și 0 vizitatori