Osnove HTML jezik za opis strukture stranice danas

Struktura HTML stranice • HTML stranica: zaglavlje i telo stranice • zaglavlje se definiše

Elementi tela HTML stranice • naslovi: <H 1>, <H 2>, <H 3>, <H 4>

Linkovi u HTML dokumentu • linkovi na druge dokumente: <A> <A HREF="http: //www. google.

Tabele • definicija tabele: <TABLE> • red u tabeli: <TR> • ćelija u redu:

Tabele • zaglavlje tabele: <TH> • ivica tabele: atribut BORDER <TABLE BORDER=“ 5”> •

Liste • neuređene liste: <UL>, <LI>, atribut TYPE <UL TYPE=“circle”> <LI>stavka 1</LI> <LI>stavka 2</LI>

Formulari za unos podataka • koriste se za interakciju sa korisnikom • definiše se

Elementi formulara za unos podataka • dugme: <INPUT TYPE=“button”> • polje za unos teksta:

Elementi formulara za unos podataka • dugme za slanje podataka: <INPUT TYPE=“submit”> • polje

Slanje podataka iz formulara serveru • akcija koja se izvršava pri slanju podataka definiše

Slanje podataka iz formulara serveru • korisnik unosi tekst: “pera” u polje “Ime” sa

Slides: 12

Download presentation

Osnove HTML • jezik za opis strukture stranice • danas se koristi za formatiranje ispisa – dizajn stranice • HTML za ispis sadržaja koristi elemente koji mogu imati pridodate atribute sa nekom vrednošću • oznaka elementa se piše između < i >, kraj elementa se označava sa </ > <element atribut=“vrednost”> sadržaj </element> • poželjno je da svaka oznaka za početak elementa ima pripadajuću oznaku za njegov kraj • poželjno je da se vrednosti atributa navode unutar “ “

Struktura HTML stranice • HTML stranica: zaglavlje i telo stranice • zaglavlje se definiše <HEAD> elementom, sadrži servisne informacije - <TITLE>, <META> elemente • telo stranice se definiše <BODY> elementom i sadrži sve ostale elemente <HTML> <HEAD> <TITLE> Naslov </TITLE> </HEAD> <BODY> Telo stranice </BODY> </HTML>

Elementi tela HTML stranice • naslovi: <H 1>, <H 2>, <H 3>, <H 4> • paragrafi: <P> • prelom linije: <BR> • komentari: upisuju se između  • atributi: ALIGN – LEFT, RIGHT, CENTER: <H 1 ALIGN=“CENTER”> Naslov </H 1> • atributi tela stranice: BGCOLOR, BACKGROUND • formatiranje teksta: <B>, <I>, <BIG>, <SMALL>, <SUB>, <SUP> • preformatiran tekst: <PRE> • uvlačenje teksta: <BLOCKQUOTE>

Linkovi u HTML dokumentu • linkovi na druge dokumente: <A> <A HREF="http: //www. google. com/">google</A> • linkovi unutar dokumenta: sidro odredište: <A NAME="P 4"> link prema odredištu: <A HREF="#P 4"> slanje e-maila: <A HREF=“mailto: ime@domen. com">Mail</A>

Tabele • definicija tabele: <TABLE> • red u tabeli: <TR> • ćelija u redu: <TD> <TABLE> <TR> <TD>red 1 ćelija 1</TD> <TD>red 1 ćelija 2</TD> </TR> <TD>red 2 ćelija 1</TD> <TD>red 2 ćelija 2</TD> </TR> </TABLE>

Tabele • zaglavlje tabele: <TH> • ivica tabele: atribut BORDER <TABLE BORDER=“ 5”> • ćelja se prostire preko više kolona: atribut COLSPAN <TABLE COLSPAN=“ 2”> • širina tabele: atribut WIDTH <TABLE WIDTH=“ 50%”> • rastojanje između ćelija: atribut CELLSPACING <TABLE CELLSPACING=“ 2”> • unutrašnja margina ćelije: atribut CELLPADDING <TABLE CELLPADDING=“ 5”> • tabele se često koriste za precizno pozicioniranje sadržaja strane ugnježdavanjem

Liste • neuređene liste: <UL>, <LI>, atribut TYPE <UL TYPE=“circle”> <LI>stavka 1</LI> <LI>stavka 2</LI> </UL> • uređene liste: <OL>, <LI>, atribut TYPE • liste mogu da se ugnježđuju

Formulari za unos podataka • koriste se za interakciju sa korisnikom • definiše se <FORM> elementom koji sadrži polja za unos • podaci koje korisnik unese obrađuju se na strani WWW servera – CGI, PHP, JSP, Java servleti, ASP, . . . • polja za unos su većinom <INPUT> elementi • tip polja definiše atribut TYPE • ime polja definiše NAME atribut • podrazumevana vrednost polja je data VALUE atributom • kao rezltat akcije korisnika, www klijent serveru šalje parove ime/vrednost za sva polja za unos koja se nalaze na formularu

Elementi formulara za unos podataka • dugme: <INPUT TYPE=“button”> • polje za unos teksta: <INPUT TYPE=“text”> • logičko povezivanje polja: <FIELDSET> • checkbox: <INPUT TYPE=“checkbox”> • radio dugme: <INPUT TYPE=“radio”> • dugme za poništavanje izmena: <INPUT TYPE=“reset”>

Elementi formulara za unos podataka • dugme za slanje podataka: <INPUT TYPE=“submit”> • polje za unos lozinke: <INPUT TYPE=“password”> • skriveno polje: <INPUT TYPE=“hidden”> • polje za unos više linija teksta: <TEXTAREA> • padajuća ili scrolling lista: <SELECT> i <OPTION>, atribut MULTIPLE

Slanje podataka iz formulara serveru • akcija koja se izvršava pri slanju podataka definiše se atributima ACTION i METHOD elementa <FORM> • ACTION sadrži URL adresu stranice kojoj se šalju podaci, vrednost METHOD atributa je način prenosa – GET, POST <FORM ACTION=“prijavise. php” METHOD=“get”> Ime: <INPUT TYPE=“text” NAME=“ime”> Lozinka: <INPUT TYPE=“password” NAME=“lozinka”> <INPUT TYPE=“submit” NAME =“prijavise” VALUE=“Prijavi se”> </FORM>

Slanje podataka iz formulara serveru • korisnik unosi tekst: “pera” u polje “Ime” sa imenom “ime” “moja_lozinka” u polje “Lozinka” sa imenom “lozinka” • nakon izbora dugmeta “Prijavi se” poziva se stranica “prijavise. php” • stranici “prijavise. php” se prenose sledeći parovi ime/vrednost: ime lozinka prijavise = pera = moja_lozinka =1