Za obimni tekstovi, na primjer za mail poruke, zgodno je koristiti ovaj element. Generiše se pomoću oznaka i ima sljedeće opcije:
– ime- naziv polja,
– cols- širina polja u znakovima,
– redova- broj redova teksta vidljivih na ekranu,
– zamotati- prelamanje riječi:
– isključeno- nema prijenosa
– virtuelno- prikazan je prijenos, ali server prima nedjeljiv niz,
– fizički- prenos i na ekranu i pri ulasku na server.
– onemogućeno- neaktivno polje,
– samo za čitanje- Dozvoljeno samo čitanje.
rezultat:
Padajuće liste
Liste dolaze u opcijama jednostrukog i višestrukog odabira. Oba se postavljaju pomoću oznaka , unutar kojih se nalaze elementi vrijednosti, dato oznakom Uzmite u obzir parametre ovih oznaka:
– ime- ime liste. Svaki odabrani element liste, kada se proslijedi serveru, izgledat će ovako: ime.vrijednost, gdje je vrijednost (vrijednost) preuzeta iz oznake opcije;
– veličina- određuje broj vidljivih elemenata u listi: 1 - jednostavna padajuća lista, više od 1 - lista sa trakom za pomicanje;
– višestruko- Omogućava odabir više stavki liste.
– odabrano- označavaju najvjerovatniji element liste za odabir, ako je lista sa višestrukim izborom, onda se može označiti nekoliko stavki;
– vrijednost- vrijednost koja će biti poslana serveru ako je stavka odabrana.
Koji jezik želite da naučite:
Koliko ste vremena spremni potrošiti na ovo?
Koje dane u sedmici biste voljeli vježbati?
(odaberite sa pritisnutim ctrl taster)
rezultat:
Ima još oznaka<optgroup>… , što vam omogućava da grupišete elemente liste prema nekim kriterijumima. Na primjer, da biste kreirali katalog web-mjesta u obliku liste, tada je prikladnije podijeliti ga u grupe prema interesima. Napomena u ovaj slučaj završne oznake su obavezne. primjer koda:
Imenik web stranice:
rezultat:
natpisi
Svi elementi obrasca mogu se povezati sa svojim oznakama pomoću elementa i njegov parametar za, čija je vrijednost naziv elementa s kojim povezujemo natpis. Na primjer:
rezultat:
Stanje posla
U skladu sa opcijom kreiranja obrasca za unos podataka. Stranica treba da sadrži sljedeće vizuelne elemente:
1. naslov;
2. tekst koji objašnjava svrhu obrasca;
3. obrazac za unos podataka, prema opciji. Sami odaberite vrste elemenata za unos podataka (najmanje 3 različita);
4. dugmad - " POŠALJI», « CLEAR»;
5. informacije o kreatoru stranice - Puno ime, grupa, e-mail.
Slika 1 - Približan prikaz stranice
Dodajte dugme svakom polju obrasca Objašnjenje“, kada se klikne, otvara se prozor sa objašnjenjima i/ili slikom, dugme “ CLOSE».
Pritiskom na dugme " POŠALJI“, provjerava se ispravnost popunjavanja podataka obrasca - sva polja su popunjena, numerička polja sadrže dozvoljene vrijednosti, vodeći i zadnji razmaci su uklonjeni. Ako se podaci jednog ili više polja ne podudaraju, treba prikazati prozor u kojem treba prikazati naziv i kratak tekst koji objašnjava zahtjeve za podatke unesene u polje. Ako su podaci ispravno uneseni, podaci se šalju nakon potvrde u dijaloškom okviru. Na formular stavite dva skrivena polja With trenutni datum i vrijeme, koji se također prenose na server. Primjer obrasca:
Slika 2 - Približan prikaz obrasca za unos podataka
Tabela 1 - Varijante obrazaca za unos podataka
Opcija | Opis |
Radionica, stranica, puni naziv Količina obavljenog posla | |
UDK, puno ime autor, ime, broj | |
Broj voza, Naziv, Mjesto polaska, Mjesto dolaska, Kategorija | |
Organizacija, puno ime, godina rođenja, Zauzet prostor | |
Država, površina, stanovništvo, kontinent, glavni grad | |
Marka automobila, Broj, Boja, Godina proizvodnje, Kilometraža | |
Rasa psa, Nadimak, Otac, Majka, Datum rođenja, puno ime i prezime vlasnika | |
Vrsta povrća, Naziv sorte, Datum sadnje, Datum berbe, Berba | |
Disciplina, Obim predavanja, Obim laboratorija, Vrsta kontrole, Grupa | |
Datum, Temperatura, Pritisak, Oblačnost, Smjer vjetra | |
Naziv, Kompanija, Trošak, Količina, Datum | |
Naziv benda, država, album, datum izlaska, prodajni broj | |
Naziv vrha, Visina, Država, Godina osvajanja, Broj uspona | |
Puno ime, godina rođenja, visina, težina, krvna grupa | |
Puni naziv, Oblast djelatnosti, Godina rođenja, Država, Broj publikacija |
Kontrolna pitanja
1. Opišite oznaku za kreiranje tekstualno polje. Navedite njegovu sintaksu.
2. Opišite oznaku za kreiranje tekstualnog polja za unos lozinke. Navedite njegovu sintaksu.
3. Opišite oznaku za kreiranje okvira za potvrdu. Navedite njegovu sintaksu.
4. Opišite oznaku za kreiranje dugmadi. Navedite njegovu sintaksu.
5. Opišite oznaku za kreiranje polja za odabir datoteka. Navedite njegovu sintaksu.
6. Opišite oznaku za kreiranje višerednog tekstualnog polja. Navedite njegovu sintaksu.
7. Opišite oznaku za kreiranje padajuće liste. Navedite njegovu sintaksu.
Učitelj Stišenok E.O.
Farberov A.G.
Ovaj element obrasca je dizajniran da stvori područje u koje možete unijeti više redova teksta. U takvom tekstualnom polju je dozvoljeno raditi prelome redova, oni se čuvaju prilikom slanja podataka na server.
Višelinijsko tekstualno polje je neophodno za dodavanje komentara na članke, pisanje postova na forumu, umetanje i uređivanje postova na blogu i u mnogim drugim slučajevima kada jedan red teksta očigledno nije dovoljan.
Sintaksa za kreiranje polja je sljedeća.
Između oznaka možete staviti bilo koji tekst koji će biti prikazan unutar polja. Ako nema teksta, tada će polje u početku biti prazno.
Važeći atributi su navedeni u tabeli. jedan.
Kreiranje polja za višeredni tekst prikazano je u primjeru 1.
Primjer 1: Tekstualno polje
Rezultat primjera prikazan je na sl. jedan.
Rice. 1. Podrazumevani prikaz tekstualnog polja
Za
V
Primjer 2. Tekstualno polje sa tekstom
Rezultat ovog primjera prikazan je na sl. 2. Imajte na umu da su svi razmaci i prijelomi reda unutra
Rice. 2. Polje za tekst
Obično dimenzije
Za kreiranje područja u koje možete unijeti više redova teksta, element
Višelinijsko tekstualno polje je neophodno za dodavanje komentara na članke, pisanje postova na forumu, umetanje i uređivanje postova na blogu i u mnogim drugim slučajevima kada jedan red teksta očigledno nije dovoljan. Sintaksa za kreiranje polja je sljedeća.
Između oznaka možete staviti bilo koji tekst koji će biti prikazan unutar polja. Ako nema teksta, tada će polje u početku biti prazno.
Važeći atributi su navedeni u tabeli. jedan.
Kreiranje višelinijskog tekstualnog polja prikazano je u primjeru 1.
Nijedan od ovih atributa nije obavezan, tako da jednostavan obrazac za podnošenje teksta izgleda ovako (primjer 1).
Primjer 1: Tekstualno polje
Rezultat primjera prikazan je na sl. jedan.
Rice. 1. Podrazumevani prikaz tekstualnog polja
Prilikom oblikovanja višerednog polja primjenjuju se ista svojstva stila kao i za jednoredni tekst. Naime, možete promijeniti širinu (svojstvo širine), visinu (visinu), ivicu (border), boju teksta i pozadine (boju i pozadinu, respektivno) itd. Primjer kreiranja tekstualnog polja različitih karakteristika prikazan je u primjeru 2.
Primjer 2: Stiliziranje tekstualnog polja
Rezultat ovog primjera prikazan je na sl. 2.
Rice. 2. Promijenite izgled polja za tekst
Svi pretraživači osim Internet Explorera podržavaju promjenu veličine za
U posljednjem video tutorijalu naučili smo kako napraviti padajuću listu u HTML-u. Proučili smo nekoliko tagova i vidjeli kako sve to funkcionira na živim primjerima.
Danas ćemo proučiti još nekoliko oznaka i njihovih atributa. Naučite kako dodati višelinijsko tekstualno polje u obrazac. Hajde da razgovaramo o drugom načinu dodavanja dugmadi u HTML obrazac.
HTML oznaka textarea: višeredni tekst.
Tag
Također je vrijedno napomenuti da je HTML oznaka
Atribut cols je odgovoran za širinu polja, mjerenu brojem znakova koji se mogu napisati u jednom redu. A nakon što broj znakova dostigne maksimum naveden u atributu cols, the nova linija. Osim toga, prilikom navođenja širine, samo polje će odmah dobiti veličinu navedenu u znakovima.
Atribut rows je odgovoran za visinu polja mjerenu brojem redova. Ali ovdje je vrijedno napomenuti da ako količina teksta premašuje navedeni broj redova, to ne znači da nećemo moći dalje pisati, samo će se pojaviti traka za pomicanje, a vidljivo područje teksta će imati visinu navedenu u vrijednost atributa rows.
Uzorak HTML koda za višelinijsko polje za unos teksta. Ne zaboravite da se ovaj kod mora postaviti između oznaka
Unesite svoju recenziju:
Primjer rezultata u Chrome pretraživač prikazano na sl. jedan.
Rice. 1. Podrazumevani prikaz tekstualnog polja
Dodatno, polje može biti u dva stanja - blokirano i samo za čitanje. HTML5 specifikacija ne definiše izgled polja i teksta u takvim stanjima, pa ga pretraživači drugačije prikazuju (slika 2).
Opera | |
Tekst unutar blokiranog polja ne može se odabrati i dodati, a sadržaj takvog polja obrazac ne šalje serveru. Tekst unutar okvira za čitanje može se kopirati, ali se ne može uređivati. Primjer 2 pokazuje kako kreirati polje za čitanje.
Primjer 2 Polje za čitanje
HTML5 IE Cr Op Sa Fx
Kopirajte tekst ispod i zalijepite ga u polje zahtjeva za lozinku.
Imajte na umu da polje za čitanje izgleda potpuno kao normalno tekstualno polje, ali korisnik mu neće moći ništa dodati. Zato ga pažljivo koristite kako ne biste zavarali ljude.