ölkökkököl

Programiranje Internet Programiranje Internet aplikacijap j

HTML II dHTML II deo

Boje i HTML

Rad sa bojama se identično organizuje sa svim elementima t istranice:

Preko preredefinisanog engleskog i b j ( " ll " ž t naziva boje (npr. "yellow" za žutu

boju)Ili k h k d i l RGB Ili preko heksadecimalne RGB vrednosti ispred koje obavezno treba staviti simbol # (npr #ffff00)treba staviti simbol # (npr. #ffff00)

Atributi body tagal č d l k đU slučaju da se prilikom navođenja

taga BODY izostave opisani atributi, čitač im dodeljuje predefinisane čitač im dodeljuje predefinisane vrednosti. Boja pozadine se određuje atributom oja po ad e se od eđuje at butobgcolor u okviru <BODY> taga. <body bgcolor="#ffff00">

<body bgcolor="yellow">

Atributi body tagaPored pozadine, može se menjati i boja teksta, pomoću atributa text.

<body bgcolor="#ffff00" text="#008000">ili <body bgcolor="#ffff00" text="green">ili<body bgcolor="yellow" text="#008000"><body bgcolor= yellow text= #008000 >ili<body bgcolor="yellow" text="green">

Atributi body tagaKao i promena boje, pozadina u obliku slike se definiše pomoću odgovarajućeg atributa u BODY tagu. Atribut je u ovom slučaju background.g j j gNa primer, ako se želi da se kao pozadina stavi slika "pozadina1.jpg" tada će odgovarajući tag izgledati: izgledati: <body background="pozadina1.jpg">Pri definisanju pozadine u obliku slike, dobra

k j d d fi iš i b l t ib tpraksa je da se definiše i bgcolor atribut.<body background="pozadina1.jpg" bgcolor="#0000ff">

IMG tagU okviru HTML stranice slika se prikazuje pomoću <IMG> taga. Ovaj tag mora imati bar jedan atribut - src atribut koji definiše jnaziv, i eventualno lokaciju, grafičkog fajla koji se želi prikazati u g g j jokviru stranice. <img src="osam.gif">img src osam.gif

IMG tagleft postavlja sliku uz levu marginu: left - postavlja sliku uz levu marginu: <img src="osam.gif" align="left">right - postavlja sliku uz desnu marginu:right postavlja sliku uz desnu marginu:<img src="osam.gif" align="right">top - poravnava sliku sa vrhom slova u

ćp p

tekućoj liniji:<img src="osam.gif" align="top">bottom poravnava sliku sa donjom bottom - poravnava sliku sa donjom ivicom slova:

<img src="osam.gif" align="bottom">g g gSlika se prikazuje u originalnoj veličini!

IMG tagiddl t lj lik t k j d j i i l middle - postavlja sliku tako je donja ivica slova

na sredini slike:<img src="osam.gif" align="middle">absmiddle - postavlja sliku tako da se sredina slike i sredina slova poklapaju:<img src="osam.gif" align="absmiddle">img src osam.gif align absmiddleDa bi se promenila originalna veličina slike, željena veličina se može definisati pomoću dva atributa: height i width.height i width.

<img src="osam.gif" height="50%" width="70%">Treba imati u vidu da se procenti odnose na deo radne površine browsera ne na originalne radne površine browsera, ne na originalne dimenzije slike

IMG tagPrazan prostor između slike i okolnog teksta ili nekih Prazan prostor između slike i okolnog teksta, ili nekih drugih elemenata stranice, može se definisati pomoću dva atributa: hspace i vspace. Vrednost ova dva atributa se zadaje u pikselima.

i " if" h "50" "50"<img src="osam.gif" hspace="50" vspace="50">U okviru stranice može se definisati i debljina granice pomoću atributa border čija se vrednost zadaje u pikselima. p<img src="osam.gif" border="5">alt atribut će u slučaju da čitač korisnika stranice iz bilo kog razloga ne učita sliku, na onom mestu gde bi trebalo da bude slika prikazati tekst koji predstavlja vrednost ovog da bude slika prikazati tekst koji predstavlja vrednost ovog atributa.<img src="osam.gif" alt="Broj osam">

Linkovii đ liči ih i i jVeze između različitih stranica se nazivaju

linkovi ili hiperveze. One omogućavaju jednostavan prelazak sa jednog mesta na stranici na drugo mesto unutar same stranice ili stranici na drugo mesto unutar same stranice ili na sasvim novoj stranici.Linkovi koji se mogu definisati u okviru jedne HTML stranice mogu se podeliti na tri grupe:HTML stranice mogu se podeliti na tri grupe:

krajnja pozicija se nalazi na stranici koja je u okviru iste aplikacije i nalazi se na istom serveru gde i stranica sa polaznom pozicijom,krajnja pozicija se nalazi na stranici koja ne pripada istoj aplikaciji, već se nalazi na drugom serveru,krajnja pozicija pripada istoj stranici kao i polazna pozicijapozicija

LinkoviZ li k d fi i ij č i ij d bij Za sve linkove definicija početne pozicije se dobija korišćenjem taga <A>. Opšti izgled ovog taga je:<A atribut> ... </A>. Sintaksa ovog taga podrazumeva da se opišu:Sintaksa ovog taga podrazumeva da se opišu:

fizička pozicija polazne pozicije (gde stoji link i kako izgleda) fizička lokacija krajnje pozicije. definicija pozicije na koju se može stići putem nekog drugog linka (labela)linka (labela)

Polazna pozicija označava na stranici mesto sa koga se prelazi na neki drugi deo stranice i definiše se pomoću atributa href:

<A HREF= “adresa krajnje pozicije”> polazna pozicija sa koje se prelazi na krajnju </A>

Link na stranicu u okviru istog servera

Najjednostavniji slučaj rada sa linkovima je prelazak na stranicu u okviru istog servera.Kod ove vrste linkova koristi se tag <A> sa atributom href i nazivom stranice do sa atributom href i nazivom stranice do koje se želi da se napravi veza.<a href="Prva html"> Veza do stranice <a href= Prva.html > Veza do stranice Prva.html </a>


S i k j j i ij i š i d i j Stranica sa krajnjom pozicijom osim što pripada istoj aplikaciji, odnosno serveru, u opštem slučaju ne mora da se i fizički nalazi u istom direktorijumu gde i stranica sa polaznom pozicijom.Postoje dva rešenja ovog problema, a to je rad sa apsolutnim i relativnim putanjamaKorišćenje apsolutnih putanja podrazumeva u okviru href atributa navođenje pune putanje do stranice sa krajnjom atributa navođenje pune putanje do stranice sa krajnjom pozicijom, na primer href=”c:\Aplikacije\Poslovanje\Klijent\Prva.html”Korišćenje relativnih putanja je mnogo podesnije, jer se zasniva na kretanju u odnosu na direktorijum stranice sa zasniva na kretanju u odnosu na direktorijum stranice sa polaznom pozicijom.


N k di k ij X d ži i 1 i 2 Y i 3 Z Neka direktorijum X sadrži stranice 1 i 2, Y stranicu 3, a Z stranicu 4Za stranicu 1,

relativna adresa stranice 2 je “2 html”; relativna adresa stranice 2 je 2.html ; relativna adresa stranice 3 je “Y/3.html”; relativna adresa stranice 4 je “Y/Z/4.html”;

Za stranicu 3, črelativna adresa stranice 2 je “../2.html” (simbol .. označava

direktorijum iznad direktorijuma gde se nalazi stranica sa polaznom pozicijom); relativna adresa stranice 4 je “Z/4.html”;

Za stranicu 4, relativna adresa stranice 2 je “../../2.html”; relativna adresa stranice 3 je “../3.html”.

Link na stranicu izvan serveraDa bi se pristupilo stranici izvan serverapotrebno je navesti celu web adresu te t i O šti blik d k j stranice. Opšti oblik adrese koja se

pojavljuje kao vrednost href atributa jescheme://server domen [:port]/putanja/ scheme://server.domen [:port]/putanja/ imeDokumenta

<a href="http://www etf bg ac yu/"> Link <a href= http://www. etf.bg.ac.yu/ > Link ka Elektrotehnickom fakultetu </a>

Link na istu stranicuZ li k i k Za ovu vrstu linkova prvo se napravi oznaka na mestu na stranici gde se nalazi krajnja pozicija. Oznaka se dobija pomoću atributa name <A> taga: <A NAME= "ime krajnje pozicije"> tekst krajnje e_ aj je_po c je e s aj jepozicije sa koje se prelazi iz polazne pozicije </A> na polaznoj poziciji navodi se tag sa imenom krajnje pozicije:<A HREF="#ime_krajnje_pozicije"> tekst polazne pozicije</A> pozicije</A> na krajnjoj poziciji se navodi tag koji definiše ime krajnje pozicije: <A NAME= " ime krajnje pozicije "> tekst krajnje _ j j _p j j jpozicije /A>

Link na istu stranicuHTML<HTML><HEAD><TITLE> Link u okviru iste stranice</TITLE></HEAD>

<BODY><H2>Programiranja </H2><OL>

<LI> <A HREF="#html"> Web i jezik HTML </A> ; <LI> <A HREF="#java"> Programski jezik Java </A> <LI> <A HREF= #java > Programski jezik Java </A> <LI> <A HREF="#uvodc"> Uvod u C</A>

</OL><H3> <A name="html"> Web i jezik HTML</A> </H3>

<p>................<BR>................</p><p>................<BR>................</p><p>................<BR>................</p>

<H3> <A name="java"> Programski jezik Java </A> </H3><p>................<BR>................</p><p> <BR><p>................<BR>................</p><p>................<BR>................</p>

<H3> <A name="uvodc"> Uvod u C </A> </H3><p>................<BR>................</p>/p<p>................<BR>................</p><p>................<BR>................</p>

</BODY></HTML>

Link na određenu pozicijuk ž li d i k dAko se želi da se uspostavi veza sa nekom drugom

stranicom, ali ne sa početkom te stranice, već nekim drugim delom, potrebno je koristiti i prvu i drugu vrstu linkova drugu vrstu linkova. Opet se definiše mesto odakle se želi nastaviti sa pregledom pomoću atribut href u <A> tagu sa navođenjem imena stranice ali se dodaje deo navođenjem imena stranice, ali se dodaje deo #ime_krajnje_pozicije, da bi se pozicioniralo na krajnju poziciju.

<a href="PrimerLinka html#ime krajnje pozicije "> <a href= PrimerLinka.html#ime_krajnje_pozicije > tekst polazne pozicije </a>

Slika kao linkSlika u HTML dokumentu može predstavljati i polazni čvor u hipervezi.Ciljna adresa se tada navodi kao kod Ciljna adresa se tada navodi kao kod običnog linka, a umesto teksta koji se može aktivirati navodi se tag IMG.

<A HREF="URL dolazne datoteke"> tag IMG ž lj lik /AIMG za željenu sliku</A>

<a href="Primer.html"><img src="osam gif"/></a>src= osam.gif /></a>

Link za elektronsku poštui k i i k i i i i i j ilLinkovi se mogu iskoristiti i za pisanje nove mail

poruke pomoću default programa za elektronsku poštu h f " ilt dj dj j dji @ tf b " <a href="mailto: [email protected]"> Posaljite e-mail poruku! </a>Pored adrese na koju se želi poslati poruka mogu se podesiti još neki parametri kao što su naslov ili podesiti još neki parametri, kao što su naslov ili tekst poruke.

<a href="mailto: [email protected]?subject=Primer poruke&body=Napisite vas komentar"> Posaljite eporuke&body=Napisite vas komentar > Posaljite e-mail poruku! </a>

Tabele

Tabela se definiše pomoću taga<table>Pojedinačna ćelija se definiše u okviru <td> </td>, a ćelija o u td /td , a će jazaglavlja u okviru <th> </th>Novi red se definiše sa <tr> </tr>Novi red se definiše sa <tr> </tr>.Naziv tabele se definiše tagom <caption><caption>

Tabele TABLE<TABLE>

<CAPTION> sadrzaj naslova tabele </CAPTION> <TR> <TH> sadržaj prve ćelija headera </TH> <TH> sadržaj prve ćelija headera </TH>

<TH> sadržaj poslednje ćelije headera </TH> </TR> <TR> <TD> sad žaj p e ćelije p og eda </TD> <TD> sadržaj prve ćelije prvog reda </TD>

<TD> sadržaj poslednje ćelije prvog reda </TD> </TR> <TR> <TD> sadržaj prve ćelije poslednjeg reda </TD>

<TD> sadržaj poslednje ćelije poslednjeg reda </TD> </TR> </TABLE></TABLE>

Tabele

Tabele<HTML><BODY><TABLE border=“20" cellpadding=“35" cellspacing="10"><CAPTION> sadrzaj naslova tabele </CAPTION> <TR> <TH> sadržaj prve celija headera </TH>

<TH> sadržaj poslednje celije headera </TH> </TR> <TR> <TR> <TD> sadržaj prve celije prvog reda </TD>

<TD> sadržaj poslednje celije prvog reda </TD> </TR> <TR> <TR> <TD> sadržaj prve celije poslednjeg reda </TD>

<TD> sadržaj poslednje celije poslednjeg reda </TD> </TR> </TABLE></TABLE></BODY></HTML>

T b l Tabele

Tabele redovi

<table border="3" cellpadding="5" cellspacing="5">

<tr> <td>hello</td><td>hello3</td> <td>h ll 5</td></t ><td>hello5</td></tr>

</table>U datom primeru “hello”, “hello3” i “hello5” su ćelije u okviru istog reda

Tabele - kolone

Da bi se napravila nova kolona potrebno je koristiti tag <tr>

<table border="3" cellpadding="5" cellspacing="5">

<tr><td>hello</td></tr><tr><td>hello3</td></tr><tr><td>hello5</td></tr></table>/

Tabele primerbl b d "2"<table border="2">

<tr><th><font face="Verdana" size="2">Ime:</font></th><th><font face="Verdana" size="2">Prezime:</font></th><th><font face Verdana size 2 >Prezime:</font></th><th><font face="Verdana" size="2">Zvanje:</font></th>

</tr><tr>

<td><font face "Ve dana" si e "2">Bosko</font></td><td><font face="Verdana" size="2">Bosko</font></td><td><font face="Verdana" size="2">Nikolic</font></td><td><font face="Verdana" size="2">Predavac</font></td>

</tr>/<tr>

<td><font face="Verdana" size="2">Djordje</font></td><td><font face="Verdana" size="2">Jevdjic</font></td><td><font face="Verdana" size="2">asistent</font></td><td><font face= Verdana size= 2 >asistent</font></td>

</tr></table>

Tabele primerbl b d "2" h i h "30%" id h "80%"<table border="2" height="30%" width="80%">

<tr><th><font face="Verdana" size="2">Ime :</font></th><th><font face="Verdana" size="2">Prezime :</font></th>

th f t f "V d " i "2" Z j /f t /th<th><font face="Verdana" size="2">Zvanje :</font></th></tr><tr>

<td><font face="Verdana" size="2">Bosko</font></td>td f t f "V d " i "2" Nik li /f t /td<td><font face="Verdana" size="2">Nikolic</font></td>

<td><font face="Verdana" size="2">Predavac</font></td></tr></table>

Ime : Prezime : Zvanje : Bosko Nikolic Predavac

Tabele primer

Ćelije zaglavlja su pojačano prikazane i žsadržaj je podrazumevano centriran u

okviru ćelije

Tabele primerbl b d "2" id h "100%" ! 100% i i k<table border="2" width="100%"> <!– 100% sirine ekrana-->

<tr><th width="33%"><font face="Verdana" size="2">Ime : </font></th> <!– 33% sirine tabele -- ><th width="33%"><font face="Verdana" size="2">Prezime : <th width= 33% ><font face= Verdana size= 2 >Prezime : </font></th><th width="33%"><font face="Verdana" size="2">Zvanje : </font></th>

</tr>/<tr>

<td><font face="Verdana" size="2">Bosko</font></td><td><font face="Verdana" size="2">Nikolic</font></td><td><font face="Verdana" size="2">Predavac</font></td>/ /

</tr></table>

Ime : Prezime : Zvanje :Ime : Prezime : Zvanje :Bosko Nikolic Predavac

cellpadding i cellspacingDva atributa koja imaju veliku primenu su i cellpadding i cellspacing. Pomoću cellpadding atributa definiše se Pomoću cellpadding atributa definiše se rastojanje između sadržaja ćelije i njene granične linije.g jPomoću cellspacing atributa se može odrediti rastojanje između pojedinih ćelija t b ltabele.

<table border="2" cellpadding="30" cellspacing="10">cellspacing= 10 >

colspan i rowspanHTML dopušta mogućnost da se pojedine ćelije tabele protežu duž više redova ili kolona tabele kolona tabele. Ovakav efekat se može postići pomoću atributa colspan i rowspan, koji se p p , jubacuju u <td> ili <th> tag one ćelije koja se želi posebno da formatira.V d t ih t ib t d j b j Vrednost ovih atributa se zadaje brojem kolona ili redova tabele duž kojih treba da se prostire data ćelija.se prostire data ćelija.

Tabele i liste: primer

FrejmoviFrejmovi omogućavaju da se formira dokument koji će se sastojati od adresa bar dva različita dokumentadva različita dokumenta.Osnovni tag je složeni tag <FRAMESET>. Ovaj tag zamenjuje tag <BODY> u HTML-j g j j gdokumentu.Tag <FRAMESET> ima atribute:

COLS za vertikalnu podelu prozora i ROWS za horizontalnu podelu prozora navigatora. navigatora.

FrejmoviAdresa dokumenta se navodi u okviru taga FRAME čiji su atributi:SRC, preko koje se zadaje adresa dokumenta koji će biti prikazan u zoni tog taga i taga i MARGINWIDTH i MARGINHEIGHT T NOFRAMES d ži k b Tag NOFRAMES sadrži poruku za browser koji nije u stanju da interpretira frejmove.

FrejmoviOpšta struktura HTML stranice sa frejmovima je:

<HTML><HTML><HEAD> … </HEAD><FRAMESET><FRAMESET>

<FRAME src=“…”>…

<FRAME src=“…”></FRAMESET></FRAMESET></HTML>

Frejmovi

Frejmoviib i S d O S i CO SAtributi <FRAMESET> taga, pored ROWS i COLS:

FRAMEBORDER: Vrednost “1” ili “yes” ovog atributa prikazuje granicu između dva frejma, dok

d t “0” ili “ ” ik j vrednost “0” ili “no” ne prikazuje. BORDER: Vrednost atributa je debljina granice između frejmova izražena u pikselima.

šBORDERCOLOR: Definiše boju granice između frejmova. Ovaj atribut se primenjuje jedino pod uslovom da je atribut FRAMEBORDER postavljen na aktivnu vrednost aktivnu vrednost. FRAMESPACING: Definiše razmak između granica frejma i njegovog sadržaja izraženog u pikselima.

FrejmoviHTML<HTML>

<HEAD><TITLE>Nova stranica sa frejmovima</TITLE>

</HEAD></HEAD><FRAMESET ROWS="20%, 80%" FRAMEBORDER="NO"

BORDER="3"> <FRAME SRC="menu.html"> <FRAME SRC="main.html">

</FRAMESET><NOFRAMES>

U okviru vaseg citaca nije moguce prikazati ovu stranicu.</NOFRAMES></HTML>

FrejmoviAtributi <FRAME> tagaAtributi <FRAME> tagaSRC: definiše adresu dokumenta koji će se učitati u okviru frejma. BORDERCOLOR: Definiše boju za ivicu frejma. FRAMEBORDER: Vrednost '1' ili 'yes' ovog atributa prikazuje

i f j d k d t '0' ili ' ' ik j granicu frejma, dok vrednost '0' ili 'no' ne prikazuje. MARGINWIDTH: Definiše veličinu praznog prostor između leve i desne strane frejma i njegovog sadržaja izražen u pikselima. MARGINHEIGHT: Definiše veličinu praznog prostor između vrha i d f j i j d ž j i ž ik li dna frejma i njegovog sadržaja izražen u pikselima. NAME: Specificira ime frejma koje se može koristiti u okviru drugih programskih modula, kao što su JavaScript ili VBScipt. NORESIZE: Aktivnom vrednošću ovog atributa se sprečava korisnik d d l č f O b d bda menja zadatu veličinu frejma. Ovaj atribut se samo navodi bez ikakve vrednosti. SCROLLING: Vrednosti ovog atributa su 'YES', 'NO' i 'AUTO'. Ako je vrednost 'YES' scroll bar će se pojaviti bez obzira da li je potreban iline 'NO' će sprečiti njegovu pojavu a sa 'AUTO' če se pojaviti samo iline, 'NO' će sprečiti njegovu pojavu, a sa 'AUTO' če se pojaviti samo kada je potreban

FrejmoviKorišćenjem frejmova i linkova može se omogućiti promena jednog dela stranice, dok bi preostali deo stranice ostao nepromenjen.j<FRAME SRC="Primer.html" name="MenjaSe">Kod definicije linka (koji se nalazi na drugom frejmu) se navede atribut target sa vrednošću frejmu) se navede atribut target sa vrednošću koja predstavlja ime frejma čiji se sadržaj menja

<A href="http://www.google.com" t t "M j S "> P f j </A>target="MenjaSe"> Promena frejma </A>

FrejmoviStranica Glavna.html

<html><frameset cols="25%,75%">

<frame src="meni.html">< frame src ="PocetniSadrzaj.html"

name="MenjaSe"></frameset></html>

FrejmoviS i i h lStranica meni.html

<html><body><table><table><td><a href ="http://www.yahoo.com" target =

"MenjaSe">Yahoo</a> </td></tr><tr><td><a href ="http://www.etf.bg.ac.yu" target="MenjaSe">ETF</a></td></tr><tr><td><a href ="http://www.google.com" target

"M j S ">G l </ > </td></t >="MenjaSe">Google</a> </td></tr></table></body></html></html>

Frejmovi

Stranica PocetniSadrzaj.html<html><body>Ovo je stranica ciji ce se sadrzaj O o je st a ca c j ce se sad aj

promeniti ako se aktiviraju linkovi s desne strane!

</body></html> /

Zvuki iKoristi se <EMBED> tag.

Ovaj tag podržava uobičajene formate kao što su .wav, .mid, .mp3, i .au. kao što su .wav, .mid, .mp3, i .au. Osnovna struktura taga je sledeća:

b d "f l " d h " "<embed src="filename.ext" width="x" height="x" autoplay="x" hidden="x" loop="x" volume="x"></embed>p /

ZvukSRC j d j URL ( l i ili l j ) d di SRC: njegova vrednost je URL (relativna ili apsolutna putanja) do audio dokumenta. CONTROLS: moguće vrednosti ovog atributa su CONSOLE i SMALLCONSOLE. Vrednost CONSOLE definiše 144 piksela za širinu i 60 za visinu. Vrednost SMALLCONSOLE definiše 144 i 15 piksela respektivno. HEIGHT and WIDTH: Za neke čitače ovo su obavezni atributi <EMBED> taga Na HEIGHT and WIDTH: Za neke čitače ovo su obavezni atributi <EMBED> taga. Na primer njihovo izostavljanje u Netscape Communicator čitaču prouzrokuje nepredviđeb rad. Ako se za ove atribute definišu veće vrednosti od dimenzija konzole, sivi prostor se dodaje u dodatom prostoru. LOOP: Default vrednost ovog atributa je FALSE, što prouzrokuje da se audio dokument izvršava samo jednom. Ako se vrednost postavi na TRUE, dokument će dokument izvršava samo jednom. Ako se vrednost postavi na TRUE, dokument će se kontinuirano izvršavati. Takođe, moguće je specificarati i određeni broj koliko će se puta izvršiti dokument. AUTOSTART/AUTOPLAY: Postavljena vrednost TRUE ovog atributa doprineće da se audio dokument izvršava kada se stranica učita. Vrednost FALSE označava da korisnik mora aktivirati određeno dugme u okviru konzole da bi se dokument izvršio izvršio. HIDDEN: Postavljena vrednost TRUE ovog atributa doprineće da se sakrije konzola. Default vrednost je FALSE sa kojom je konzola vidljiva korisniku. Ako su vrednosti atributa HIDDEN i AUTOSTART postavljene na TRUE dobiće se isti efekat kao i korišćenjem taga BGSOUND da datim audiom dokumentom.VOLUME: Vrednost ovog atributa je broj između 0 i 100 Manji broj definiše tiši VOLUME: Vrednost ovog atributa je broj između 0 i 100. Manji broj definiše tiši zvuk. ALIGN: Moguće vrednosti ovog atributa su LEFT i RIGHT. HSPACE i VSPACE: Slično kao kod <IMG> taga ovi atributi se koriste da bi se definisao u pikselima horizontalni odnosno vertikalni prostor oko konzole.

Formei l ij f i k i i iZa implementaciju formi koristi se osnovni tag

<FORM>. Opšti oblik ovog taga je:<FORM>  ... </FORM> </FORM>

Najvažnija dva atributa taga <FORM> su:ACTION koji sadrži adresu (URL) programa na serveru; serveru; METHOD kojim je opisana metoda prenosa argumenata programa. Ovaj atribut može imati vrednosti GET ili POST.vrednosti GET ili POST.

Dugmebutton – definiše dugme opšteg tipa. Pritiskom na dugme koje je definisano pomoću ove vrednosti korisnik izvršava pomoću ove vrednosti korisnik izvršava akciju koja se mora definisati u okviru samog taga. Najčešće je to Java Script funkcija koja izvršava određene provere pre samog slanja podataka na server slanja podataka na server.

<input type="button" name="Proveri" onClick="funkcijaZaProveru() ">onClick funkcijaZaProveru() >

Dugmesubmit - definiše dugme pomoću koga se podaci šalju na server.

<INPUT TYPE="SUBMIT" NAME="Posalji">reset – definiše dugme koje postavlja sve

d l f d fvrednosti elemenata forme na predefinisane vrednosti

<INPUT TYPE "RESET" NAME "P i ti"><INPUT TYPE="RESET" NAME="Ponisti">

Tekst poljeK i i ib d fi i d šć " " Koristi se atribut type sa definisanom vrednošću "text".

<INPUT TYPE="text" NAME="ime_prez" VALUE="Unesite ime i prezime" SIZE="30">

Ako se želi da se zamaskira tekst koji korisnik unosi u tekst Ako se želi da se zamaskira tekst koji korisnik unosi u tekst polje umesto vrednosti text, treba koristiti vrednost "password" za atribut type.Pomoću atributa value definiše se početni tekst koji će se pojaviti u tekst poljupojaviti u tekst poljuPomoću atributa size se zadaje maksimalan broj karaktera koji se mogu uneti u okviru ovog elementa od strane korisnika. Vrednost atributa name definiše samo ime elementa pomoću koga drugi elementi aplikacije (JavaScript, serverski deo aplikacije) mogu čitati ili menjati unetu vrednost u okviru tekst polja.p j

Polje za potvrdulj d d fi iš k išć jPolje za potvrdu se definiše korišćenjem taga

INPUT i njegovog atributa type sa vrednošću "checkbox".

<I>Koje programske jezike poznajete?</I><BR><UL type=”square”>yp q

<LI> <INPUT type=”checkbox” name=”PPpaskal”> Paskal</LI><LI> <INPUT type=”checkbox” ypname=”PPJava”> Java</LI>

</UL>

Radio dugmedi d d d fi iš k išć jRadio dugmad se definišu korišćenjem

taga <INPUT> i njegovog atributa typesa vrednošću radio.

<I>Imate li vlastiti racunar?</I><BR><UL type=”square”>

” d ”<LI> <INPUT type=”radio” name=”racunar”> Da</LI><LI> <INPUT type=”radio” <LI> <INPUT type radio name=”racunar”> Ne</LI>

</UL>

Opadajuća listaO d j ć li d fi iš ć SELECT i ij Opadajuća lista se definiše pomoću taga <SELECT> i opcija <OPTION>. Polje <SELECT> opisuje izbor između mogućih vrednosti navedenih u okviru taga <OPTION>. Tag <OPTION> sa atributom SELECTED se uzima kao izabrana vrednost. Tag <SELECT> se realizuje kao padajući meni sa vrednostima <SELECT> se realizuje kao padajući meni sa vrednostima zadatim u okviru taga <OPTION>. Atributi uz tag <SELECT> su:

size kojim je opisan broj elementa u opcija koje će biti prikazane,multiple kojim se omogućava izbor više opcija u istom trenutku.

<B><I>Moj omiljeni predmet na 1 godini je: </I></B><B><I>Moj omiljeni predmet na 1. godini je: </I></B><select name="predmeti">

<option>Matematika 1</option><option>Matematika 2</option><option>Lab. vezbe iz Fizike</option>

</select>

Tekst poljeTag <TEXTAREA> prikazuje tekst u odvojenom tekst prozoru sa scrollbarovima scrollbarovima. Dimenzije prozora su određene atributima rows (broj redova teksta) i cols (broj ( j ) ( jkolona). Atribut name dodeljuje simboličko ime

d čj k l i t k t području u kome se nalazi tekst. <TEXTAREA name=”ime” rows=”n” cols=”m”> ... neki tekst ... </TEXTAREA>cols m ... neki tekst ... /TEXTAREA

Skrivena promenljivaČČesto je potrebo u okviru stranice zapamtiti određene vrednosti koje ne bi trebalo prikazivati korisniku na primer trebalo prikazivati korisniku, na primer vrednost koja se proverava na serverskoj strani radi zaštite aplikacije. Ova mogućnost se izvršava pomoću taga <INPUT> i njegovog atributa typesa vrednošću hidden Na primer:sa vrednošću hidden. Na primer:

<input type=”hidden” name=”ident” value="08100-OEM-38069“/>value 08100 OEM 38069 /

Primerh l <html>

<head><title>Forma za komentare</title>

</head>/head<body>

<h1>Posaljite svoje komentare</h1><form action="" method="POST"><p>Ime i p e ime <inp t name "name"><p>Ime i prezime: <input name="name"><p>Email adresa: <input type="text" name="email" size="50"><p>Komentar: <br><textarea name="comments" rows="15" cols="70"></textarea></p><br><br><input type=submit value="Posaljite komentar"><input type=reset value="Obrisite unete podatke"></form>

</body></body></html>

Primer

Primer 2<html> <head><title>Restoran italijanske hrane</title></head><body>

<h1> Restoran italijanske hrane </h1><form action="" method="POST">

<h2>Pice</h2><p>Koliko pica želite? <input name="numpizzas" value="0" size="3" maxlength="3"><p>Koliko pica želite? <input name="numpizzas" value="0" size="3" maxlength="3"><p><input type="radio" name="size" value="large" checked>Velika<br><input type="radio" name="size" value="medium">Srednja<br> <input type="radio" name="size" value="small">Mala<h3>Dodaci</h3><h3>Dodaci</h3><p><input type="checkbox" name="topping" value="pepperoni">Ljuta paprika<br><input type="checkbox" name="topping" value="mushroom">Pecurke<br><input type="checkbox" name="topping" value="ketchup">Kecap<br> <input type="checkbox" name="topping" value="egg">Jaje<br> <input type="checkbox" name="topping" value="olives">Masline<br><p>Ime: <input type="text" name="name"><p>Broj telefona: <input type="text" name="phone"> <p>Adresa:<br><textarea name="address" rows="4" cols="50"></textarea><p>Broj kreditne kartice: <input type="password" name="creditcard" size="20"></p><p>Broj kreditne kartice: <input type= password name= creditcard size= 20 ></p><input type="submit" value="Posaljite narudzbinu">

</form></body>

</html>

Primer 3

Primer 3<html> <html>

<head> <title>Prijava ispita</title> </head><body> <b><form action="" method=POST>

<i>Ime i prezime:</i> <input type=text name="name"> <br><br>p / p yp<i>Da li ste polozili kolokvijum iz Programiranja 2:</i><input type="radio" name="kol" value="Da" checked>Da<input type="radio" name="kol" value="Ne">Ne<br><br> <i>Koje ispite prijevljujete? </i><br><br><p><input type="checkbox" name="prijava" value="p1">Programiranje 1<br><input type="checkbox" name="prijava" value="oop1">Objektno orijentisano programiranje 1<br>

i " h kb " " ij " l " 2" P i j 2 b <input type="checkbox" name="prijava" value="p2">Programiranje 2<br> <input type="checkbox" name="prijava" value="m1">Matematika 1<br></p><br><input type="submit" value="Prijavi"><input type "reset" value "Brisi“><input type="reset" value="Brisi“>

</form></b></body>

</html>

Primer 4

Documents

ölkökkököl