S obzirom na osnovne HTML oznake, ne možemo ne dotaknuti tako važan element kao što su oblici. Povratne informacije su često potrebne na web stranicama. Na primjer, ispunjavanje upitnika na stranici, registracija, autorizacija, komentari itd. U svim tim slučajevima korisnik ispunjava posebna područja (polja obrasca) na stranici, nakon čega se podaci šalju na poslužitelj. Obrasci se koriste za stvaranje povratnih informacija. Obrazac je fragment HTML dokumenta namijenjen unosu korisnika.
Na slici je prikazan obrazac za prijavu učenika na web stranici obrazovne ustanove.
Za izradu obrasca koristi se spremnik
s atributom akcije, koji specificira stranicu na poslužitelju koja će obraditi podatke poslane putem obrasca.Struktura najjednostavnijeg oblika:
elementi oblika...
Svaki obrazac također treba gumb za slanje za slanje podataka nakon što je obrazac ispunjen.
Struktura gumba:
Dakle, za snimanje gotovo svih elemenata obrasca koristi se oznaka s atributom tipa. Za izradu gumba koji će resetirati sve podatke iz obrazaca, koristi se sljedeća struktura:
Postoji parametar teksta za stvaranje tekstualnog polja. U ovom slučaju koriste se sljedeći parametri: naziv - naziv polja; veličina - za polje u simbolima; maxlength - najveći mogući broj znakova u polju; vrijednost - informacije prikazane u obrascu prema zadanim postavkama
Primjer unosa obrasca s dva tekstualna polja:
Rezultat obrasca prikazan je na slici.
Ako je u tekstualno polje potrebno unijeti veliku količinu informacija, na primjer, komentar, koristi se oblik tekstualnog područja koje se stvara pomoću oznake
Rezultat rada koda s područjem teksta prikazan je na slici.
Sljedeći element obrazaca su popisi koji vam omogućuju da odaberete iz prikazanog skupa vrijednosti. Oznake vam omogućuju stvaranje obrasca popisa
Struktura unosa popisa:
Da bi element bio odabran pri učitavanju stranice, neophodan je u tag-u
Sličan način odabira su elementi obrasca potvrdnog okvira i radio gumba. Razlika između ovih elemenata je u tome što vam potvrdni okvir omogućuje višestruki izbor, a radio gumb samo jedan.
Struktura unosa potvrdnog okvira i radio gumba:
tekst
Radio gumb:
tekst
Elementi navedeni u obrisu koriste atribut checked za isticanje potvrdnog okvira i radio-gumb prema zadanim postavkama. Primjer korištenja potvrdnog okvira, radio gumba i HTML koda prikazan je na slici.
Drugi element obrasca je gumb, specificiran pomoću atributa tipa oznake s vrijednošću gumba:
U navedenom kodu za kreiranje gumba nalazi se parametar onclick, u kojem je, u pravilu, kod u programskom jeziku postavljen da izvrši radnju kada se klikne na ovaj gumb:
Javascript naredba alerted koristi se za prikaz poruke u posebnom prozoru. Rezultat primjera prikazan je na slici.
Da biste umetnuli sliku u gumb, koristite kod prikazan u sljedećem primjeru:
Prilikom registracije i prijave na stranice koristi se polje sa skrivenim testom prikazanim kao zvjezdice. Ovo je element obrasca za lozinku:
Registracija na stranici često je podijeljena na nekoliko stranica i svaka sljedeća treba sadržavati podatke s prethodne. Da bi se sakrile prenesene informacije, koristi se skriveni element obrasca:
Skriveni element obrasca bit će nevidljiv u prozoru preglednika.
Obrasci imaju element datoteke za prijenos datoteka na poslužitelj. Primjer koda za učitavanje datoteka na poslužitelj prikazan je u nastavku:
Dakle, u ovoj smo temi pogledali elemente obrasca za izradu raznih HTML stranica, koji, zajedno s rukovaocima skriptama na računalu ili poslužitelju, omogućuju razvoj punopravnih web aplikacija.
Dobar dan, ljubitelji web razvoja i oni koji žele napraviti svoju web stranicu. Prije toga, sve moje publikacije bile su posvećene glavnim elementima jezika, stvaranju različitih objekata sadržaja, njihovom formatiranju, strukturiranju itd. Nakon što svladate prethodne teme, već možete napraviti prilično dobru web stranicu. No, bilo bi nepotpuno bez današnje teme: "Izrada obrazaca u html-u".
Ovaj odjeljak na jeziku je vrlo važan. Stoga obratite posebnu pozornost na njegovo proučavanje, inače web-resurs koji ste izradili ne može biti pušten u proizvodnju. Tako ćete nakon čitanja članka znati što vam je potrebno za korištenje obrazaca, s kojim oznakama se kreiraju, a možete isprobati i konkretne primjere u praksi. Započnimo!
Što je oblik i kako funkcionira
Oblik- ovo je jedan od najvažnijih objekata koji je namijenjen razmjeni informacijskih podataka između poslužitelja i korisnika.
Jednostavno rečeno, ako želite stvoriti internetsku trgovinu s mogućnošću naručivanja proizvoda na web mjestu, zatražiti registraciju na web-resursu i raditi s računima ili pružiti kupcima povratne informacije od menadžera tvrtke, onda ne možete bez obrazaca.
Obrazac se postavlja pomoću posebnog elementa html jezika .
Imajte na umu da kodni dokument može sadržavati više deklaracija oznaka , međutim, poslužitelju se može poslati samo jedan zahtjev za obradu podataka. Zato podaci koje korisnik upisuje u za to određena polja i odnose se na različite obrasce ne bi trebali biti ovisni. Također, nije dopušteno izrađivati obrasce ugniježđene jedan u drugi.
Za nestrpljive i željne brzog pogleda na prikaz koda, priložio sam jednostavan primjer korištenja ploče s tekstualnim poljem za lozinku s gumbom:
| 1 2 3 4 5 6 7 8 9 10 11 12 |
|
Možda sada nije baš jasno što i kako djeluje u ovom malom programu, ali jamčim da ćete nakon čitanja cijelog članka moći kreirati aplikacije višestruko teže.
Slanje podataka na stranu poslužitelja
Da biste poslali upisane (ili odabrane) informacije u dijaloški okvir, morate koristiti standardni mehanizam - Gumb Pošalji.
Kod za takvu metodu izgleda ovako:
Kada se predstavljena linija pokrene, prikazat će se gumb s natpisom: "Pošalji".
Drugi način slanja podataka na stranu poslužitelja je pritiskom na Enter unutar dijaloškog okvira.
Nakon potvrde slanja navedenih informacija, ne ide odmah na poslužitelj. Prvo ga obrađuje preglednik, što rezultira oblikom "ime = vrijednost".
Parametar atributa odgovoran je za naziv tip označiti , a za vrijednost - podatke koje je unio korisnik. Zatim se transformirani niz prosljeđuje rukovaocu, koji se najčešće postavlja u atributu akcijski element .
Sam parametar akcije nije potreban, a u nekim trenucima uopće nije potreban. Na primjer, ako je stranica web-mjesta napisana pomoću php-a ili js-a, tada se obrada odvija na trenutnoj stranici i veze nisu potrebne.
Za bolje razumijevanje cjelokupne slike funkcioniranja stranice, želio bih dodati da se rad s podacima na poslužitelju obavlja na drugim jezicima. Dakle, jezici na strani poslužitelja su: Python, php, jezici slični C (C#, C, itd.), Java i drugi.
Sada bih želio stati i reći vam više o elementu ... Jednostavno rečeno, dakle potrebna za stvaranje tekstualnih polja, radio gumba, raznih gumba, skrivenih polja, potvrdnih okvira i drugih objekata.
Oznaka ne mora biti uparena , međutim, ako trebate obraditi korisničke zapise ili ih unijeti, na primjer, u bazu podataka, onda ne možete bez spremnika.
Glavni atributi ovog elementa jezika za označavanje hiperteksta su:
- Tekst- stvara tekstualno polje;
- podnijeti- stvara gumb za slanje podataka na poslužitelj;
- Slika- odgovoran je za gumb sa slikom;
- Resetiraj- postavlja gumb za brisanje obrasca;
- Lozinka- postavlja tekstualno polje posebno za lozinke;
- Potvrdni okvir- odgovoran je za polja sa zastavama;
- Radio- odgovoran je za polja s izborom jednog elementa;
- Dugme- stvara gumb;
- Skriven- koristi se za skrivena polja;
- Datoteka- postavlja polje odgovorno za slanje datoteka.
Metode prijenosa informacija
Postoje 2 načina prijenosa korisničkih podataka na stranu poslužitelja: Dobiti i Post... Ove metode rade istu stvar, ali se međusobno značajno razlikuju. Stoga, prije nego što navedemo bilo koji od njih, upoznajmo se s njihovim značajkama.
| Post | Dobiti | |
| Veličina dokumenata za prijenos | Ograničeno na strani poslužitelja. | Maksimalno - 4 KB. |
| Kako se prikazuju poslane informacije | Dostupno samo kada se gleda putem proširenja preglednika ili drugih posebnih softverskih proizvoda. | Odmah dostupno svima. |
| Korištenje oznaka | Nema načina za dodavanje u oznake, jer se zahtjevi ne ponavljaju (sve stranice povezuju na istu adresu). | Svaka stranica sa zahtjevom može se spremiti u oznake i otići na nju nakon nekog vremena. |
| Predmemoriranje | Na temelju prethodnog stavka, svi zahtjevi su na jednoj stranici. | Svaka stranica može se zasebno spremiti u predmemoriju. |
| Svrha | Koristi se za slanje velikih datoteka (knjige, slike, videozapisi, itd.), poruka, komentara. | Izvrsno za pronalaženje traženih vrijednosti na web-resursu ili za slanje kratkih tekstualnih poruka. |
Kako bi naznačili s kojim od dva načina prijenosa podataka preglednik treba raditi u elementu koristite navedeni parametar metoda(na primjer, metoda = "post").
Pogledajmo drugi primjer. Izradimo obrazac u koji trebate unijeti svoje osobne podatke (ime i prezime, datum rođenja) i smisliti lozinku. Nakon toga sve to šaljemo na poslužitelj koristeći metodu Post.
Unesite svoje osobne podatke!
Na primjer, za unos datuma postoje prekidači za datum svakog od parametara (dan, mjesec i godina), kao i za praktičnost padajući panel sa samim kalendarom.
Izrada ploče za registraciju
Pregledane su osnovne oznake i atributi. Zato je došlo vrijeme za izradu cjelovitog obrasca za registraciju koristeći stilizirane css oznake i provjeru ulaznih podataka. Naravno, s njima nećemo moći pogledati rad poslužitelja, ali ćemo dati dizajn i važne detalje.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 |
|
Savjetujem vam da ovaj programski kod spremite u dokument s .html ekstenzijom i utf-8 kodiranjem, te otvorite potonji u prozoru preglednika. Pred vama će se u svom sjaju pojaviti panel za registraciju s poljima za unos imena, prezimena, e-maila i lozinke s ponavljanjem. Imajte na umu da kada se stranica pokrene, kursor se odmah postavlja u prvi tekstni okvir. Ova tehnika se postiže kroz atribut autofokus.
Potpuno sam siguran da ste, trčeći na Internetu, više puta naišli na razne obrasce, na primjer, obrazac za registraciju, obrazac za prijavu, obrazac za povratne informacije i mnoge, mnoge druge. HTML forme.
Zapravo, obrazac se sastoji od raznih elemenata za unos: tekstualnih polja, tekstualnih područja, radio gumba, radio gumba, gumba i tako dalje.
I u ovom članku naučit ćete kako stvoriti apsolutno bilo koji.
Prvo stvorite najjednostavnije HTML stranica, kojemu dodajte spremnik (oznaku Sada idemo na oblik. Obrazac počinje oznakom , odnosno završava sa završnom oznakom
... Ova oznaka ima nekoliko atributa koje je vrlo poželjno ispuniti. Ali prvo, napravimo jednostavan obrazac s atributima oznake , tako da možete razumjeti svrhu svakog od njih: Ovdje počinjemo opisivati obrazac koji ima sljedeće atribute: 1) Atribut " Ime". Vrijednost ovog atributa znači ime HTML forme... Postavlja se pitanje zašto je to potrebno? Odgovor je vrlo jednostavan: ako koristite više od jednog oblika, ali nekoliko, tada da biste razlikovali jedan oblik od drugog, morate navesti različita imena. I sami nazivi su potrebni kako bi se odnosili na oblike, na primjer, kroz JavaScript... Reći ću vam jednu malu tajnu, koju vam ne savjetujem da koristite, ali radi iskrenosti, reći ću vam o njoj. U stvari, oblici se lako mogu razlikovati bez imena, tako da, općenito govoreći, naziv oblika uopće nije potreban. Ali ja STVARNO Preporučujem da obrascima date nazive jer ćete lakše razumjeti za što je svaki od obrazaca odgovoran. 2) Atribut " akcijski". Vrijednost ovog atributa odgovorna je za put do datoteke skripte koja će obraditi obrazac. Odnosno, nije dovoljno unijeti podatke u obrazac, još ih je potrebno obraditi u skladu s tim, a ovo je samo put na ovo rukovalac datotekama i nalazi se u vrijednosti atributa " akcijski". 3) Atribut " metoda". Može imati jedno od dva vrlo popularna značenja:" post"i" dobiti". Ovaj atribut definira način slanja. Neću ulaziti u detalje, samo ću reći da je prva metoda skriveno slanje podataka, a druga je otvorena. Da bude još jasnije, razmotrimo dvije jump adrese: a) http://mysite.ru/scipt/request.php b) http://mysite.ru/script/request.php?a=7&b=Michael U prvom slučaju, korisnik ne vidi što šalje (" post"), a u drugom on zapravo vidi nazive varijabli i njihove vrijednosti (" dobiti Vi, na kraju članka, možete pokušati poslati obrazac na dvije različite metode i provjeriti jesu li različite. Ali za sada ću reći da MNOGOčešće koristiti " post“, odnosno skriveno slanje. Ovo je bio opis samog obrasca, ali sada možete početi dodavati elemente obrascu. Prvo što ćemo dodati je tekstualni okvir. Dodavanje tekstualnog okvira pomoću oznake
, odnosno korištenjem atributa ove oznake " tip"sa značenjem" tekst". Također, prije kreiranja tekstualnog polja, preporuča se napisati što je to polje, na primjer," Tvoje ime". Unutar oznake napiši ovaj redak: Tvoje ime: Opet, raščlanimo atribute: 1) Atribut " tip"odgovoran je za tip elementa za unos. U ovom slučaju smo naznačili da se radi o običnom tekstualnom polju. U sljedećim elementima promijenit ćemo vrijednost ovog atributa. 2) Atribut " Ime"je odgovoran za naziv elementa. Ovdje smo naznačili da je naziv ovog polja ime. 3) Atribut " vrijednost"odgovoran je za zadanu vrijednost ovog polja. Kako se ono kaže, bolje je jednom vidjeti nego sto puta čuti, pa bolje kucaj ( štoviše, samo tipkajte, a ne kopirajte!) ovaj tekst u uređivaču, a zatim pogledajte rezultat u pregledniku. Sada napravimo još jedno slično polje, ali ne za unos običnih znakova, već za unos lozinke. Odnosno, sve bi trebalo biti isto, ali iza sebe treba sakriti samo tekst zvjezdice... Stoga, prelazak na sljedeći redak (oznaka Tvoja lozinka: Kao što možete vidjeti, sada vrijednost " upiši " je " lozinka". Ostali atributi su isti kao i za običan tekstni okvir. Sljedeća stavka je padajući popis. Stvara se malo kompliciranije, jer ovdje je potrebno ne samo deklarirati stvaranje padajućeg popisa, već i dodati elemente na ovaj popis. Napišimo, prelazeći na sljedeći red (dalje, ovo neću spominjati) sljedeće HTML kod. Odaberite opciju: Označiti znači početak padajućeg popisa. Popis završava oznakom
... atribut " Ime"je jasno, budući da sam to već nekoliko puta objasnio. Stavke popisa se kreiraju pomoću oznake ... Vrijednost atributa " vrijednost"znači koju će vrijednost varijabla imati izbor(na primjer, u JavaScript), odnosno bilo izbor = 1 ili izbor = 2 ili izbor = 3... Odmah nakon završetka opisa oznake staviti ono što će korisnik vidjeti na padajućem popisu. Opet, bolje je pogledati u pregledniku i odmah ćete sve razumjeti. Sada dodajmo tekstualno područje pomoću oznake Ovdje stvaramo tekstualno područje s visinom od 10
nizovi (vrijednost atributa " redovima") i širinu od 15
znakovi (vrijednost atributa " kol"). Unutar ove oznake za uparivanje tekst je naveden u zadanom tekstualnom području. Zapravo, ovdje se više nema što reći. Idemo dalje. Sljedeći element je radio gumb. Radio gumb je skup takvih " krugovima", od kojih se može odabrati samo jedan. Radio gumbi se kreiraju pomoću HTML oznaka
, ili, preciznije, korištenjem vrijednosti " radio"atribut" tip". Napišimo ovo HTML kod: Odaberite jedno ili više: Ovdje ću se usredotočiti na atribut " Ime"jer osim postavljanja imena, ima još jednu vrlo važnu značajku. Ako vi NE ako nazive ova tri radio gumba učinite istim, oni će postati neovisni i stoga možete odabrati nekoliko opcija odjednom. Da biste se u to uvjerili, promijenite imena, a zatim pokušajte odabrati nekoliko opcija odjednom, i odmah ćete se uvjeriti u moje riječi. Stoga jedna grupa radio gumba mora imati istu vrijednost atributa " Ime". Atribut" vrijednost"znači vrijednost varijable" izbor radija"(opet, na primjer, u JavaScript). Odmah nakon opisa oznake
postoji tekst koji će korisnik vidjeti pored odgovarajućeg radio gumba. Drugi element obrasca su radio gumbi ( potvrdni okvir). Ponovno se stvaraju pomoću oznake
... Napišimo sljedeće retke: Slažete se s našim pravilima: Mislim da je ovdje sve transparentno pa neću objašnjavati. Savjetujem vam samo da vidite kako to izgleda u pregledniku. I reći ću da ako je potvrdni okvir označen, onda vrijednost varijable " Pojmovi"hoće" Da", ako ne stoji, tada će vrijednost ove varijable biti" ", odnosno prazan niz. Drugi element je polje za odabir datoteke. Sigurno ste ikada učitavali datoteke na poslužitelj i često ste za to morali koristiti polje za umetanje naziva datoteke. Takvo polje se stvara pomoću već dosadne oznake
... Napišimo ovako: Odaberite datoteku za preuzimanje: Pozdrav za vas, dragi čitatelji blog stranice. Danas želim govoriti o HTML oblicima. Bez obzira na motor vaše stranice (cms), on će svakako koristiti obrasce kreirane pomoću oznaka Form i Input, kao i atributa i parametara Button, Checked, Value, Checkbox, Radio, Checkbox, Submit... Pa, također možete dodati elemente ovome za stvaranje padajućih popisa i tekstualnih polja - Select, Option, Textarea, Label, Fieldset, Legend. Isti niz za pretraživanje web-mjesta () kreira se pomoću ovih oznaka i tada će pretraživanje vašeg projekta biti obvezno. Stoga vam razumijevanje kako su uređeni i rade neće nimalo naškoditi za uspješan rad na dizajnu, a ni uz samopromociju i promociju neće biti suvišno. Dakle, s obrazloženjem potrebe za proučavanjem ovih elemenata, mislim da više ne bi trebalo biti pitanja, pa je vrijeme da prijeđemo izravno na proučavanje njihovih mogućih opcija. Da, također vas želim podsjetiti da smo već pregledali mnogo materijala na temu jezika za označavanje hiperteksta, na primjer, tri) i. U svojoj srži, obrasci se sastoje od elemenata za čije se kreiranje unutar glavnog spremnika, iz tagova obrasca, ubacuju razne oznake - Checked, Value, Checkbox, Radio, Checkbox, Submit itd. Samo trebamo postaviti njegov kod na bilo kojem prikladnom mjestu predloška web-mjesta navodeći, koristeći oznake i njihove atribute, kako bi trebao izgledati. To može biti tekstni okvir s gumbom za slanje za upit koji ste unijeli, izbori s radio gumbima (gdje možete ostaviti pritisnut samo jedan od navedenih gumba), više tekstualnih okvira s gumbom za slanje () i još mnogo toga. Na primjer, u slučaju "traži", pomoću atributa Vrijednost možete odrediti što će točno biti napisano na gumbu koji se nalazi pored polja za unos upita. Podaci uneseni u obrasce moraju se na neki način dodatno obraditi. Na primjer, u slučaju povratne informacije, korisnik, nakon što popuni polje sa svojim imenom, unese svoj e-mail i tekst poruke, a zatim klikne na gumb za slanje, imat će se pravo nadati slanju podataka s obrasca na E-mail autora stranice. No, nažalost, to nije moguće implementirati koristeći samo jedan jezik za označavanje hiperteksta (). Za tu namjenu potreban je poseban program za obradu, koji nakon što korisnik klikne na gumb za slanje preuzima sve podatke iz polja za povratne informacije i šalje ih vlasniku resursa e-poštom. Koji će program to učiniti, morate sami odrediti pomoću atributa Action. Obično je program za obradu skripta napisana u PHP-u. Stoga ćete u atributu Action oznake Form morati registrirati put do datoteke ove skripte koja se nalazi na vašem hosting poslužitelju. Navest ću kao primjer pretplatu na RSS feed mog bloga putem E-maila: Pomalo neshvatljivo, vjerojatno, čini se na početku, ali mislim da će sve biti jasno kako priča bude odmicala. Svaki obrazac mora biti priložen otvaranju i zatvaranju oznaka Oblik... Ovo je svojevrsni kontejner za njihovo stvaranje. Ova oznaka ima niz obaveznih i neobaveznih atributa: Razmotrimo ostale oznake koje vam omogućuju stvaranje raznih web obrazaca. Najsvestraniji je Ulazni... Unutar njega mora biti propisan atribut Type koji određuje kakav će točno biti HTML obrazac kreiran ovom oznakom. Sljedeći elementi mogu se izraditi pomoću unosa i tipa: Unos nema završnu oznaku. Kako će točno izgledati web obrazac kreiran njime u potpunosti ovisi o parametru navedenom u atributu Vrsta. Ako Vrsta nije navedena, tada će se prema zadanim postavkama kreirati tekstualno polje. Pogledajmo čemu služe ostali atributi: Sada idemo preko svega primjeri obrasca s unosom... Izgled tekstualnog polja sličan je izgledu polja za unos lozinke, pa ćemo razmotriti samo opciju kreiranja teksta, na primjer, za unos adrese e-pošte: (! LANG: Pogledajmo sada stvaranje web obrasca s radio gumbima (Radio): Imajte na umu da ovaj obrazac koristi ulaznu oznaku dvaput — jednom za stvaranje svakog od dva radio gumba. Štoviše, svaki od njih sadrži atribut Name s istom vrijednošću (rezultat), a vrijednost Value je različita (DA i NE). To znači da će se prilikom obrade, ako se odabere neki od radio gumba, poslati varijabla čiji je naziv napisan u Name, ali će vrijednost ove varijable ovisiti o tome koji radio gumb je odabran. Razmotrimo primjer izrade web obrasca s potvrdnim okvirima (Checkbox): Potvrdni okviri se razlikuju od radio gumba po mogućnosti odabira nekoliko opcija odjednom. Ime se koristi za definiranje u datoteci rukovatelja u kojem se potvrdnom okviru nalaze potvrdni okviri, a Vrijednost postavlja vrijednost koja će biti poslana rukovaocu (ako Vrijednost nije navedena, tekst koji se nalazi pored ovog potvrdnog okvira bit će poslan rukovaocu) . Za početak, želim vas malo podsjetiti što su, zapravo, web obrasci i zašto su potrebni na stranicama stranice. Prvenstveno su dizajnirani da ponavljaju elemente koji su dostupni u bilo kojem operacijskom sustavu na način prilagođen korisniku: gumbi, polja za unos teksta, padajući popisi, potvrdni okviri, radio gumbi i slično. Svi korisnici, bez ikakvog dodatnog objašnjenja, razumiju svrhu ovih elemenata, a ako vide Html gumb obrasca, razumiju da na njega trebaju kliknuti. Štoviše, svi njegovi sastavni elementi (poput Select, Option, Textarea, Label, Fieldset, Legend) su već gotovi radni komadi (kontejneri), za umetanje kojih će biti dovoljno samo koristiti traženu oznaku s potrebnim atributima i parametrima. Preglednici sami znaju kako prikazati određeni element web obrasca. Istina, opcije za prikazivanje istog elementa u različitim preglednicima mogu se malo razlikovati jedna od druge, ali, u pravilu, to nije bitno. Da. ispada da su web obrasci u HTML-u pokušaj prijenosa ključa elementi koji se koriste u bilo kojem operacijskom sustavu, na stranice web stranice. Ali zašto bi mogli biti potrebni na stranicama web-mjesta? Uglavnom, za istu svrhu za koju se slični elementi koriste u operativnim sustavima - prijenos podataka od korisnika. U slučaju obrazaca, podaci od korisnika se prenose na poslužitelj, gdje se obrađuju posebnim programom (nažalost, hipertekstni označni jezik ne dopušta obradu podataka). Iako se podaci mogu poslati ne samo na poslužitelj, već i, na primjer, e-poštom na adresu navedenu u atributu Action oznake Form. Prilikom slanja podataka iz Html-a na E-mail, korisnik koji ispuni polja, nakon pritiska na tipku za slanje podataka, pokrenut će program za poštu koji se prema zadanim postavkama koristi na njegovom računalu. U ovom slučaju, početna oznaka obrasca trebala bi izgledati otprilike ovako: Sljedeći se atributi mogu koristiti s Textareaom: Oznaka html Label omogućuje implementaciju jedne vrlo zanimljive značajke u obrasce koja je dostupna u operativnim sustavima. Tamo, ako se sjećate, da biste aktivirali bilo koji element, nije potrebno kliknuti na njega, možete kliknuti na naziv ovog elementa - i dalje će biti aktiviran. U web obrascima to se ne događa prema zadanim postavkama – potrebno je kliknuti na sam element HTML obrasca da ga aktivirate. Na primjer, trebate kliknuti na potvrdni okvir kako biste u njega stavili kvačicu. Klikanje na tekst pored potvrdnog okvira neće imati učinka. Isprobajte sami: Kao što vidite, klikanje na tekst za aktiviranje ovog elementa je beskorisno - morate ga sami kliknuti. Upravo je takvo stanje i namijenjeno je popravljanju oznake Label. Omogućuje vam da tekst pored elementa web obrasca učinite kliknutim, što je nedvojbeno poboljšat će upotrebljivost. Ali kako povezati Html element obrasca i teksta? Da biste to učinili, atributu dodajte ID s jedinstvenim parametrom i okružite tekst oznakama oznake za otvaranje i zatvaranje. I to nije sve. U početnoj oznaci Label morate registrirati atribut For, čiji parametar mora biti potpuno isti kao ID atribut u Html oznaci elementa obrasca. Ispada nešto ovako: Kao što vidite, sada se, zahvaljujući korištenju Label-a, elementi web obrasca mogu aktivirati ne samo klikom na njega, već i klikom na tekst koji se nalazi pored njega. Vjerojatno ste često vidjeli da su veliki oblici u HTML-u podijeljeni u grupe (Fieldset), koje su okružene okvirom, a svaka takva grupa ima svoj naslov (Legenda). To se radi sa samo dvije oznake: Fieldset i Legend. Oni su upareni, t.j. moraju imati otvaranje i zatvaranje bez greške. Dakle, da biste stvorili grupu sastavnih dijelova, trebate sve te dijelove umotati u oznake otvaranja i zatvaranja Fieldseta. A da biste postavili naslov (Legendu) za ovu grupu, morate odmah nakon otvaranja Fieldseta napisati strukturu iz početne i završne Legende, između kojih trebate umetnuti tekst naslova grupe. Evo primjera stvaranja grupa pomoću Fieldseta i Legende: Sretno ti! Vidimo se uskoro na stranicama blog stranice Možda ste zainteresirani Select, Option, Textarea, Label, Fieldset, Legend - Html oznake padajućeg izbornika i obrasca za tekstni okvir HTML obrasci su složeni elementi sučelja. Uključuju različite funkcionalne elemente: polja za unos i
), napišite sljedeći kod:
opcija 1
Opcija 2
Opcija 3
Zašto smo potrebni i kako obrasci funkcioniraju na modernim web stranicama
Oznake za obrazac i unos za stvaranje gumba, potvrdnih okvira i radio gumba
Primjeri obrazaca stvorenih na unosu s različitim vrijednostima za vrstu
Ostali atributi oznake Input i primjeri njihove uporabe
Select, Option, Textarea, Label, Fieldset, Legend - padajući popisi, tekstualna područja i drugi elementi web obrazaca
Oznaka - čemu služi ova Html oznaka u obrascu?
Fieldset i Legenda - razbijanje oblika na dijelove
možete pogledati više videozapisa ako odete na
");">
Popisi u HTML kodu - oznake UL, OL, LI i DL 
MailTo - što je to i kako napraviti link u HTML-u za slanje e-pošte 
Kako se postavljaju boje u Html i CSS kodu, odabir RGB nijansi u tablicama, Yandex i drugi programi