...

Test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test.

Test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test.

Test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test.

Test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test.

Test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test.

Test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test.

Paragaf sa plavom pozdinom i crvenim slovima Boldiran tekst sa crvenom pozadinom i pavim tekstom test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test.

Paragaf sa zutom pozdinom i plavim slovima test test test test test test test INTWARE : bjela pozdina i crna slova test test test test test test test test test test test test test test test test test test test test test test test test test.

Paragaf sa crvenom pozdinom i plavim slovimatest. U ovom paragrafu je podeseno tako da svu sva slova (mala i velika) prikazana kao stampana velika slova.

Pozadniska boja je plava

Ispisani tekst "float" desno

Tackasti okvir "border-style:dotted;"

Puni okvir plave boje "border-style:solid; border-color:Blue;"

Gornja linija "border-top-style:groove;"

Razmak izmedju slova "letter-spacing:12px"

Velicina slova "font-size:larger;"

Pozicioniranje teksta "text-align:center"

Promjena kursora "cursor:hand"

Stil ispisa fonta "font-style:oblique;"

Desna linija okvira "border-right:solid;"

Izgled fonta "font-family:Jokerman;"

Uvucen tekst 15px "text-indent:15px;"

Nevidljiv tekst

Lijeva linija okvira "border-left-style:ridge;"

NASLOV H1

Test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test

Test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test

Test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test

NASLOV H1

Tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst

Tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst tekst

INTERNET PROGRAMIRANJE I | 2010

NASLOV H1

Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text

Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text

Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text

NASLOV H1

Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text

...


Sadržaj liste se definišu pomoću nestovih zatovrenih TAG-ova
• • ...
  
  
  Ne sortirane liste mogu da se sastoje od neograničenog brojla TAG-pva
• koji denišu sadržaj liste.
  • ...
  • ...
  • ...
  • ...
  • ...
  
  
  INTERNET PROGRAMIRANJE I | 2010
  
  
  
  
  67
  
  PRIMJER 18 :: Ne sortirane liste
  • Prvi element
  • Drugi element
  • Treći element
  
  
  INTERNET PROGRAMIRANJE I | 2010
  
  
  
  68
  
  5.2.2. Sortirane liste Sortirane liste su elementi koji se definišu pomoću TAG-ova
  ...
  
  
  Sadržaj liste se definišu pomoću nestovih zatovrenih TAG-ova
  • • ...
    
    
    Ne sortirane liste mogu da se sastoje od neograničenog brojla TAG-pva
  • koji denišu sadržaj liste.
    1. ...
    2. ...
    3. ...
    4. ...
    5. ...
    
    
    INTERNET PROGRAMIRANJE I | 2010
    
    
    
    
    69
    
    PRIMJER 19 :: Sortirane liste
    
    INTERNET PROGRAMIRANJE I | 2010
    
    
    1. Prvi rendi broj
    2. Drugi redni broj
    3. Treći redni broj
    
    
    70
    
    5.2.3. Liste definicija Liste definicija su elementi koji se definišu pomoću TAG-ova

    ...

    
    
    Sadržaj liste se definišu pomoću nestovih zatovrenih TAG-ova

    i

    gdje TAG

    definiše naslov a TAG

    definiše definiciju za isti nalsov.

    ...

    ...

    
    
    Liste definicija mogu da se sastoje od neograničenog brojla TAG-pva

    i

    koji denišu sadržaj liste.

    ...

    ...

    ...

    ...

    
    
    INTERNET PROGRAMIRANJE I | 2010
    
    

    
    
    71
    
    PRIMJER 20 :: Liste definicija
    
    INTERNET PROGRAMIRANJE I | 2010
    
    

    Def1

    Opis definicije 1

    Def2

    Opis definicije 2

    Def3

    Opis definicije 3

    
    
    72
    
    PRIMJER 21 :: Kombinacija lista
    
    INTERNET PROGRAMIRANJE I | 2010
    
    

    • Prvi element
      1. Prvi rendi broj
      2. Drugi redni broj
      3. Treći redni broj
    • Drugi element
      1. Prvi rendi broj
      2. Drugi redni broj
      3. Treći redni broj
    • Treći element
      1. Prvi rendi broj
      2. Drugi redni broj
      3. Treći redni broj

    
    
    73
    
    5.3. Forme Forme se koriste za prikupljanje podataka koji se kasnije koriste za obradu. Forma je element FROM koji se definiše pomoću zatvorenog TAG-a

    . ...
    
    Zajedno sa TAG-om

    potrebno je definisati dva atributa koji su ključni za funkcionalnost forme. Prvi atribut je targer. Atribut target definiše lokaciju, Web stranicu ili drugi internet resurs prema kojem se šalju podatci na formi. ...
    
    Drugi atribut je koji se koristi sa TAG-om

    je atribut method. Ovaj atribut definiše način na koji se šalju podaci na lokaciju koja je definisana u atributu target. Atribut method može da posjeduje dvije vrijednsoti a to su post i get. Ako je vrijednost atributa method get onda se podaci salju putem URL targeta gdje se id elementa unutar forme stavlja zajedno sa vrijednosti iste. ...
    
    URL:
    
    podnesiFormu.html?elem1=vred1& elem2=vred2& elem3=vred3
    
    Ako je vrijednost atributa method post onda se podaci salju putem posebnog prtokola gdje se id elementa unutar forme stavlja zajedno sa vrijednosti iste. ...
    
    INTERNET PROGRAMIRANJE I | 2010
    
    
    
    74
    
    Forme se sastoje od raznih elemenata. Osnovni elementi formi su labele, tekstalni editori, radio lista, textbox lista, opcionalnih lista, multilinijskih tekstualnih editora, dugmadi i drugih elemenata.
    
    Svi elementi imaju jednu zajedničku stvar. Svi elementi moraju imati definisane atribute ID i NAME. U praksi se pokazalo naj bolje da se vrijednsoti atributa ID i NAME iste vrijednosti.
    
    5.3.1. Label Labele se koriste kako bi se prikazao tekstualni dio. Definiše se pomoću zatvorenih TAG-ova . OVO JE LABELA
    
    5.3.2. Textbox Elementi TEXTBOX se koriste ka prikupljanje tekstualnih informacija. Definiše se pomoću zatvorenih TAG-ova . OVO JE LABELA INTERNET PROGRAMIRANJE I | 2010
    
    
    
    75
    
    5.3.3. Password Elementi TEXTBOX se koriste ka prikupljanje tekstualnih informacija stim što se skriva sadžaj koji se unosi u element. Definiše se pomoću zatvorenih TAG-ova .
    
    OVO JE LABELA
    
    5.3.4. Checkbox Koristi se za prikupljanje podataka. Checkbox može da bude označen ili ne označen. Pored atributa id i name potrebno je definisati i atribut value. Atribut value definiše vrijednost koja će biti poslata ako je checkbox označen. Definiše se pomoću otvorenog TAGa . Chekcbox1 Chekcbox2 Chekcbox3
    
    Koristi se za prikupljanje podataka. Radiobutton može da se sastoji od više elemenata od kojih samo jedan može da bude označen dok su svi ostali ne označeni. Pored atributa id i name potrebno je definisati i atribut value. Atribut value definiše vrijednost koja će biti poslata ako je checkbox označen. Definiše se pomoću otvorenog TAG-a . Kako bi se grupisali radiobutton elementi na formi, potrebno je da elementi koji treba da su grupisani imaju iste vrijednosti atribura id i name ali različite vrijednosti atributa value.
    
    Chekcbox1 Chekcbox2 Chekcbox3
    
    INTERNET PROGRAMIRANJE I | 2010
    
    5.3.5. Radio button
    
    76
    
    
    
    5.3.6. Dropdown liste Koristi se za prikupljanje podataka. Element SELECT se definiše pomoći zatvorenih TAG-ova <select>. Zatvoteni TAG-ovi option pored atributa id i name može da se sastoji od dodatnih atributa koji definišu veličinu select liste, stil dropdown liste i drugih kako vizualnih tako i funkcionalnih atributa. <select name=“slc1“ id=“slc1“> ...
    
    INTERNET PROGRAMIRANJE I | 2010
    
    Sadržaj doropdown liste se definiše pomoću elementa OPTION koji se definiše pomoći zatvorenih TAG-a . Unutar elementa OPTION ne treba da se definišu atributi id i name ali je potrebno da se definiše atribut value. Atribut OPTION se definiše unutar atributa SELECT. Broj atributa OPTION koji će se naći unutar atributa SELECT nije ograničen.
    
    77
    
    <select name=“slc1“ id=“slc1“> OPT1 OPT2 OPT3 OPT4
    
    
    
    5.3.7. Fieldset Fieldset se koristi kako bi se grupisali određeni elementi unutar jednog okvira. Element FILEDSET se koristi kako bi se vizualno odvojili određeni elementi od drugih. Definiše se pomoći zatvorenog TAG-a

    .
    
    

    ...

    
    
    5.3.8. Dugmad Postoje tri vrste dugmad a to su dugmadi koje su elementi vrste SUBMIT, RESET i BUTTON. Element SUBMIT se koristi kako bi se prihvatio sadržaj elemenata na formi i prosljedio na destinaciju definisnom atributa taget koji su definisati unutar elementa FORM na način koji je definisan atributom method. Definiše se pomoću otvorenih TAG-ova .
    
    
    
    Element RESET se koristi kako bi se poništio sadržaj i inicijalne promjene elemenata na formi koje su unušeni od strane korsiniska. Definiše se pomoću otvorenih TAG-ova .
    
    INTERNET PROGRAMIRANJE I | 2010
    
    
    
    78
    
    
    
    Element BUTTON se koristi kako bi se pozvao određeni događaj ili funkcionalnost. Više o događajima i funkcija u sledećim djelova. Definiše se pomoću otvorenih TAG-ova .
    
    INTERNET PROGRAMIRANJE I | 2010
    
    
    
    79
    
    PRIMJER 22 :: Forma
    
    

    OVO JE LABELA Text box1:
    
    Text box2:
    
    Password:
    
    Chekcbox1 Chekcbox2 Chekcbox3
    
    Radiobutton1-1 Radiobutton1-2 Radiobutton1-3
    
    Radiobutton2-1 Radiobutton2-2 Radiobutton2-3
    
    
    
    SELECT 1 : <select name="slc1" id="slc1"> OPT1 OPT2 OPT3
    SELECT 2 : <select name="slc2" id="Select2" size="5">
    
    INTERNET PROGRAMIRANJE I | 2010
    
    
    
    80
    
    OPT1 OPT2 OPT3 OPT4 OPT5 OPT6 OPT7
    
    
    
    
    
    

    
    
    INTERNET PROGRAMIRANJE I | 2010
    
    
    
    81
    
    6. CSS 6.1. CSS i XHTML CSS je skraćenica sa Cascading Style Sheets. CSS se koristi kako bi se definisale globalne klase ili stilovi te se isti pridružili elementima na Web stranicic. Te klase ili ti stilove služi da zamjene pojednačno definisanje atributa stil unutar svih elemenata. Kao što smo definisali u predhonim djelovima, stilovi se koriste skoro pa u svim elementima koje podržava XHTML. U stvarnosti stil je JEDAN ATRIBUT ELEMENTA koji se definiše kao style=““. Koristi se izrazito za definisanje vizulanog izgleda elementa na Web stranici. Ono samo utiče na vizulani izgled stranice. Primjenjuje se tek prilikom kompajliranja Web stranice ili drugim rječima rečeno prilikom prevođenja Web stranice od strane Web pretraživača. Atribut STYLE definiše jedan ili više svojih internih atributa te se može koristiti unuter otvorenih i zatvorenih TAG-ova. Atributi STYLE atributa se definiše tako što nalaze unutar navodnih znakova, te imaju nazviv atributa, seperator (:) i vrijednost atributa. Svaki sledeći atribut je počinje tako što se predhoni završi sa ;. ... Ili ..
    
    Interni CSS se definiše unutar HTML stranice. Obično se definiše unutar elementa HEAD. Interni CSS se definiše pomoću elementa STYLE koji se definiše pomoću TAG-a <style> i potrebo je definisati dodatne atribut type. Atrbut type definiše sintaksu jezika koja će se koristiti prilikom prevođenja od strane Web stranice. <style type="text/css"> ...
    
    INTERNET PROGRAMIRANJE I | 2010
    
    CSS kod je u stvari skup internih atributa koje posjeduje atribut style. Pored style atributa elemenata koji je takođe dio CSS familije, CSS kod se može proizvesti unutar HTML Web stranice, to jeste interni CSS koji je predstavljem kao globalna kontrole ili kao eksteni dokument povezan sa web stranicom.
    
    82
    
    Eksterni CSS je u stvari dototka koja posjeduje sav sadržaj ili definicije stilova. Datotka je vrste .css. HTML stanica se povezuje pomoću elementa LINK koji se definiše pomoću TAG-a . Element LINK se dešiniše unutar HEAD elementa i potrebo je definisati dodatne atribute href, rel i type. Atribut href definiše lokaciju na kojoj se nalazi CSS datoteka. Kao kod linkova i slika, da bi se koristili stilovi i klase CSS datoteka one moraju biti dostupčane. CSS datoteke mogu da budu na istoj lokaciji kao i Web stranica, na istom računaru ili serveru kao Web stranica, na lokalnoj mreži pa ča i na internetu. Atribut rel definiše i objašnjava Web pretraživaču koja vrsta jezika se nalazi unutar datoteke definisane atributom href. Atrbut type definiše sintaksu jezika koja će se koristiti prilikom prevođenja od strane Web stranice.
    
    INTERNET PROGRAMIRANJE I | 2010
    
    
    
    83
    
    6.2. Struktura i sintaksa CSS se može postmatrati kao zaseban MARKUP jezik koji se koristi prilikom razvoja Web stranica. Kao zaseban MARKUP jezik, on posjeduje svoju sintaksu koja se mora primjeniti kako bi CSS imao svoju funkcionalnost. Osnova upotreba CSS-a jeste da se definišu stilovi elemenata koji se nalaze na Web stranici, što implicira da za svaki element koji je podržan i koji je sastavni dio HTML markup jezika može imati svoju CSS definiciju. Kada se definiše CSS stil elementa, gdje god se pojavi taj element, na istom će se primjeniti definisani stil. Možemo da definišemo pojedinačno svaki element. Definisanje se vršti tako što se unutar STYLE elementa ili unutar CSS eksterne datoteke definiše naziv tog elementa i preteće srednje zagrade. Unutar srednjih zagrada definišu se stil atributi tog elementa. Za jedan element možemo da definišemo više atributa tako što ćemo svaki atribut razdvojiti sa “;“.
    
    INTERNI CSS Interni CSS predstvalja definisanje stilova elemenata unutar iste stranice na kojoj se programiranju ti elementi. Tačnije rečeno, svi stilovi se devinišu na samoj stranicic unutar tagova head. Interni CSS ima sopstveni element za definisanje istih koji se definišu pomoću tagova style. Prilikom definisanja style elementa, potrebno je definisati i atribut type koji definiše kodni jezik.
    
    <style type="text/css"> elment1 { Atribut1=vrijednost1; Atribut2=vrijednost2; Atribut3=vrijednost3; Atribut4=vrijednost4; Atribut5=vrijednost5; } Elment2 { Atribut1=vrijednost1; Atribut2=vrijednost2; Atribut3=vrijednost3;
    
    INTERNET PROGRAMIRANJE I | 2010
    
    .html stranica
    
    84
    
    } ... ... ...
    
    EKSTERNI CSS Eksterni CSS predstvalja yasebnu datoteku unutar koje se definišu stilovi elemenata a koje se mogu vezati sa svim elementa iste vrste na svim stranicama povezanim stranicama. Tačnije rečeno, svi stilovi se devinišu unutar samo jednog dokumena a povezuju se sa stanicama pomoću elementa link koji se definiše unutar elementa head.
    
    .html stranica ... ... INTERNET PROGRAMIRANJE I | 2010
    
    ...
    
    85
    
    .css DOKUMENT (čiji je naziv style.css) elment1 { Atribut1=vrijednost1; Atribut2=vrijednost2; Atribut3=vrijednost3; Atribut4=vrijednost4; Atribut5=vrijednost5;
    
    INTERNET PROGRAMIRANJE I | 2010
    
    } elment2 { Atribut1=vrijednost1; Atribut2=vrijednost2; Atribut3=vrijednost3; }
    
    86
    
    PRIMJER239 :: Interni CSS <style type="text/css"> body { background-color:Black; color:Red; } p { background-color:Red; color:White; }

    Test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test

    
    
    INTERNET PROGRAMIRANJE I | 2010
    
    Test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test
    
    87
    
    

    Test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test

    
    
    PRIMJER 24 :: Eksterni CSS Style.html

    Test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test

    Test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test

    Test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test

    
    
    body { background-color:Black; color:Red; } p { background-color:Red; color:White; }
    
    INTERNET PROGRAMIRANJE I | 2010
    
    Style.css
    
    88
    
    Ako unutar CSS-a imamo određene elemente koji imaju definisane identične atribute onda se za iste može definisati jedan set stil atributa tako što ćemo elemente postaviti jedan pored drugog sa , između elemenata.
    
    INTERNI CSS .html stranica <style type="text/css"> elment1, element2, element3... { Atribut1=vrijednost1; Atribut2=vrijednost2; Atribut3=vrijednost3; Atribut4=vrijednost4; Atribut5=vrijednost5; ... ... ...
    
    EKSTERNI CSS
    
    INTERNET PROGRAMIRANJE I | 2010
    
    .html stranica
    
    89
    
    ... ... ...
    
    .css DOKUMENT (čiji je naziv style.css)
    
    INTERNET PROGRAMIRANJE I | 2010
    
    elment1, element2, element3... { Atribut1=vrijednost1; Atribut2=vrijednost2; Atribut3=vrijednost3; Atribut4=vrijednost4; Atribut5=vrijednost5; }
    
    90
    
    PRIMJER 25 :: Interni CSS <style type="text/css"> body { background-color:Black; color:Red; } p { background-color:Red; color:White; } h1,h2,h3,h4,h5 { background-color:Yellow; color:Green; }
    
    INTERNET PROGRAMIRANJE I | 2010
    
    

    Naslov H1

    Test test test test test test test test test test test test test test test test test test test test test test test test test test

    
    
    91
    
    

    Naslov H3

    Test test test test test test test test test test test test test test test test test test test test test test test test test test

    Naslov H4

    Test test test test test test test test test test test test test test test test test test test test test test test test test test

    
    
    PRIMJER 26 :: Eksterni CSS Style.html

    Test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test

    Naslov H3

    Test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test
    
    INTERNET PROGRAMIRANJE I | 2010
    
    

    Naslov H4

    Test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test

    
    
    92
    
    Style.css
    
    INTERNET PROGRAMIRANJE I | 2010
    
    body { background-color:Black; color:Red; } p { background-color:Red; color:White; } h1,h2,h3,h4,h5 { background-color:Yellow; color:Green; }
    
    93
    
    Kroz CSS možemo da definišemo stil elementa koji se nalzi unutar drugog elmenta. Ako želimo da definišemo stil elementa B (bold) kojie se nalazi negdje unutar elementa P (paragraf), stil unutar CSS-a se definiše tako što se vanjsli element piše prvi a onda unutrašnji drugi elment sa samo razmakom između dva. INTERNI CSS .html stranica <style type="text/css"> elment1 element2 { Atribut1=vrijednost1; Atribut2=vrijednost2; Atribut3=vrijednost3; Atribut4=vrijednost4; Atribut5=vrijednost5; }
    
    EKSTERNI CSS .html stranica
    
    elment1 element2 { Atribut1=vrijednost1; Atribut2=vrijednost2; Atribut3=vrijednost3; Atribut4=vrijednost4; Atribut5=vrijednost5; }
    
    INTERNET PROGRAMIRANJE I | 2010
    
    .css DOKUMENT
    
    94
    
    PRIMJER 27 :: Interni CSS <style type="text/css"> body { background-color:Black; color:Red; } p { background-color:Red; color:White; } h1,h2,h3,h4,h5 { background-color:Yellow; color:Green; } pb { background-color:Blue; font-family: Calibri; }
    
    INTERNET PROGRAMIRANJE I | 2010
    
    

    Naslov H1

    
    
    95
    
    

    Test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test

    Naslov H3

    Test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test

    Naslov H4

    
    
    INTERNET PROGRAMIRANJE I | 2010
    
    

    Test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test

    
    
    96
    
    PRIMJER 28 :: Eksterni CSS Style.html

    Naslov H1

    Test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test

    Naslov H3

    Test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test
    
    INTERNET PROGRAMIRANJE I | 2010
    
    

    Naslov H4

    Test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test

    
    
    97
    
    Style.css body { background-color:Black; color:Red; } p { background-color:Red; color:White; } h1,h2,h3,h4,h5 { background-color:Yellow; color:Green; }
    
    INTERNET PROGRAMIRANJE I | 2010
    
    pb { background-color:Blue; font-family: Calibri; }
    
    98
    
    Unutar CSS-a se mogu definisati posebne specifične klase. Te klase imju funkcionalnost i rade na istim principima kao i CSS stilovi za elementa sa minimalnim razlikama. Klase se definišu tako što, umjesto predefinisanog naziva elementa, naziv klase definiše korisnik. Naziv elementa može biti bila koja riječ koju korisnik postavi. Da bi klasa bila funkcionalna, naziv svake klase mora početi sa tačkom. Da bi se klasa primjenila u korištenje, potrebno je unutar HTML elementa definisati novi atribut class cija vrijednost je naziv klase u navodnim znacima.
    
    INTERNI CSS .html stranica <style type="text/css"> .klasa { Atribut1=vrijednost1; Atribut2=vrijednost2; Atribut3=vrijednost3; Atribut4=vrijednost4; Atribut5=vrijednost5; }
    
    ...
    
    INTERNET PROGRAMIRANJE I | 2010
    
    EKSTERNI CSS
    
    99
    
    .html stranica ...
    
    .css DOKUMENT .klasa { Atribut1=vrijednost1; Atribut2=vrijednost2; Atribut3=vrijednost3; Atribut4=vrijednost4; Atribut5=vrijednost5;
    
    INTERNET PROGRAMIRANJE I | 2010
    
    }
    
    100
    
    PRIMJER 29 :: Interni CSS
    
    INTERNET PROGRAMIRANJE I | 2010
    
    <style type="text/css"> body { background-color:Black; color:Red; } p { background-color:Red; color:White; } h1,h2,h3,h4,h5 { background-color:Yellow; color:Green; } pb { background-color:Blue; font-family: Calibri; } .mojaKlasa { background-color:Green; color:Yellow; }
    
    101
    
    

    Naslov H1

    Test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test

    Naslov H3

    
    
    Test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test
    
    INTERNET PROGRAMIRANJE I | 2010
    
    

    Naslov H4

    Test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test

    
    
    102
    
    PRIMJER 30 :: Eksterni CSS Style.html

    Naslov H1

    Test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test

    Naslov H3

    Test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test
    
    INTERNET PROGRAMIRANJE I | 2010
    
    

    Naslov H4

    Test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test

    
    
    103
    
    Style.css body { background-color:Black; color:Red; } p { background-color:Red; color:White; } h1,h2,h3,h4,h5 { background-color:Yellow; color:Green; }
    
    INTERNET PROGRAMIRANJE I | 2010
    
    pb { background-color:Blue; font-family: Calibri; } .mojaKlasa { background-color:Green; color:Yellow; }
    
    104
    
    7. JAVASCRIPT
    
    7.1. Uvod u JAVASCRIPT Java script je porgramerski jezik koji je Client-Side jezik. Funkcionalnosti koje se programriaju u javascript jeziku se izvršavaju na osnovu događaja pokrenutih od strane korisnike, te ih izvršava računar koristnika Pored funkcia mogu se generisati kontrole procedure pa i XHTML elementi koji će dati dinamičnost Web stranici. Javascript kod se može integrisati zajedno sa XHTML elemetima to jeste da je interan ili da se funkcije i funkcionalnosti nalaze u posebnoj datoteci ili da isti bude eksteran. Interne javascript funkcije se definišu unutar HTML stranice. Obično se definišu unutar elementa HEAD ali se isto tako mogu naći unutar BODY elementa. Interni javascript se definiše pomoću elementa SCRIPT koji se definiše pomoću TAG-a <script> i potrebo je definisati dodatne atribut type. Atrbut type definiše sintaksu jezika koja će se koristiti prilikom prevođenja od strane Web stranice.
    
    INTERNET PROGRAMIRANJE I | 2010
    
    <script type="text/javascript"> ...
    
    105
    
    Eksterni javascript je u stvari dototka koja posjeduje sve funkcije i funkcionalnosti potrebne za Web stranicu. Datotka je vrste .js. HTML stanica se povezuje pomoću elementa SCRIPT koji se definiše pomoću TAG-a <script>. Element SCRIPT se dešiniše unutar HEAD elementa i potrebo je definisati dodatne atribute src i type. Atribut sec definiše lokaciju na kojoj se nalazi javascript datoteka. Kao kod linkova, slika i CSS datoteka, da bi se koristile funkcije javascript datoteka one moraju biti dostupčane. Javascript datoteke mogu da budu na istoj lokaciji kao i Web stranica, na istom računaru ili serveru kao Web stranica, na lokalnoj mreži pa čak i na internetu. Atribut type definiše sintaksu jezika koja će se koristiti prilikom prevođenja od strane Web stranice. <script src="javascript.js" type="text/javascript"> 7.2. Osnovna sintaksa i upotreba
    
    Javascript je programerski jezik koji posjeduje sobstvenu sintaku ili pravila kako se komande moraju primjenjivati. Sintaksa javascript jezika je veoma slična ako čak ne i identična sintaksi C++ programerskog jezika. Prvo ključno pravilo koje se treba zapamtiti jeste da se svaka linija koda u javascrpit završava sa ;. Javascrpit programerski jezik posjeduje svoje predefinisane funkcije i klase koje se mogu pozivati prilikom razvoja funkcija i funkcionalnosti. Te funkcije se standardizovane i svi Web pretaživači prepoznaju i poznavaju iste. Javascpirt se izvršava linearno, to jeste od dozgo ka dole. Osnovna upotreba javascpit programerskog jezika jeste da se izvrše određene operacije i da se prikažu potrebni sadržaji na Web stranici. Funkcija za prikazivanje teksta na Web stranici je predefinisana javascript funkcija koja prikazuje navedeni tekst na stanici. Definiše pozivajući funkcija document.write(’’tekst’’). Ova funkcija ispisuje insturkcije koje se nalaze unutar navodnih znakova.
    
    <script language=’’text/javasctipt’’>
    
    Osim sirovog teksta, javascrpit funkcija document.write može da prikaže XHTML elemente pojedinačno, grupno ili u kombinaciji XHTML elemenata i sirovog teksta. <script language=’’text/javasctipt’’>
    
    document.write(’’

    Ovo je JAVASCRIPT teskt unutar paragrafa

    ’’); // -->
    
    PRIMJER 31 :: Osnovne funkcije javascpir programerskog jezika
    
    
    
    INTERNET PROGRAMIRANJE I | 2010
    
    
    106
    
    <script type="text/javascript"> document.write("OVO JE JAVASCPIT KOD unutar elementa HEAT"); document.write("

    Ovo je javascpit kod koji se nalazi unutar elementa P

    "); <script type="text/javascript"> document.write("
    Ovo je javascpript kode koji unutar elementa BODY

    ---

    "); document.write("

    Naslov javascript

    "); document.write("

    Ovo je javascript kod koji se nalazi unutar elementa P

    ");
    
    INTERNET PROGRAMIRANJE I | 2010
    
    
    
    107
    
    7.3. Varijable
    
    Varijable ili promjenjljive su rezervisani prostor memorije. Naziv varijable se definiše kako bi se na logički način, jednostavniji i prepoznatljiviji način programera, moglo dodi do rezervisane lokacije. Varijable se koriste kako bi se snimila željena vrijednost, arithmetička ili tektstualna, te ista bila dostupna za dalju upotrebu ili manipulaciju sa drugim funkcijama i operacijama. Varijable se mogu koristiti za arithmetičke i matematičke funkcionalnosti ali isto tako i za povezivanje tekstualnih nizova. Definisanje varijabli se se izvršava unutar elementa SCRPIT. Komanda var, koja je prefiks nazivu varijable, definiše da je u pitanju varijabla. Nazivi varijabli nebi trebali da sadrže razmake, slova ščdžŠĐČDŽ ili samo brojeve. Poženo je nazvati varijable tako što de naziv iste adekvatno predstavljati sadržaj koji se nalazi u istoj varijabli.
    
    <script language=’’text/javasctipt’’>
    
    Vrijednost ili sadržaj varijabli se može definisati na dva načina. Prvi način je definisanje sadržaja prilikom inicijalnog definisanja varijable. <script language=’’text/javasctipt’’>
    
    var nazivVarijable = vrijednostVarijable; // -->
    
    Drugi način je definisanje sadržaja nakon što je definisana varijabla. <script language=’’text/javasctipt’’>
    
    INTERNET PROGRAMIRANJE I | 2010
    
    
    
    Sadržaj varijable se može prikazati pomoću funkcije document.write. <script language=’’text/javasctipt’’>
    
    INTERNET PROGRAMIRANJE I | 2010
    
    
    
    109
    
    Nakon što su vatijable definisane, iste se mogu pozvati, promjeniti ili iskoristiti sa drugim operacijama bilo gdje na Web stranici. <script language=’’text/javasctipt’’>
    
    <script language=’’text/javasctipt’’>
    
    INTERNET PROGRAMIRANJE I | 2010
    
    
    
    110
    
    PRIMJER 32 :: Osnovne funkcije javascpir programerskog jezika i upotreba varijabli
    
    INTERNET PROGRAMIRANJE I | 2010
    
    <script type="text/javascript"> var naslov; naslov = "

    Javascpit stranica

    "; var podnaslov = "

    Pod naslov H3

    "; var sadrzaj; <script type="text/javascript"> sadrzaj = "

    Dobdrodosli na moju javascipt stranicu.

    " document.write(naslov); document.write(podnaslov); document.write(sadrzaj);
    
    111
    
    7.4. Arithmetičke operacije Arithemtiče opracije se najčešde izvršavaju nad varijablama ili u kombinaciji varijabli i teksta.
    
    7.4.1. + (plus) Sabira dva ili više broja. <script language=’’text/javasctipt’’>
    
    Sabira varijable. <script language=’’text/javasctipt’’>
    
    Spaja tekstualne vrijednosti.
    
    INTERNET PROGRAMIRANJE I | 2010
    
    
    
    112
    
    <script language=’’text/javasctipt’’>
    
    INTERNET PROGRAMIRANJE I | 2010
    
    
    
    113
    
    7.4.2. – (minus) Oduzima dva ili više broja.
    
    <script language=’’text/javasctipt’’>
    
    Oduzima varijable. <script language=’’text/javasctipt’’>
    
    INTERNET PROGRAMIRANJE I | 2010
    
    
    
    114
    
    7.4.3. * (puta) Množi dva ili više broja.
    
    <script language=’’text/javasctipt’’>
    
    Množi varijable.
    
    <script language=’’text/javasctipt’’>
    INTERNET PROGRAMIRANJE I | 2010
    
    -->
    
    115
    
    7.4.4. / (podjeljeno) Dijeli dva ili više broja. <script language=’’text/javasctipt’’>
    
    Dijeli varijable. <script language=’’text/javasctipt’’>
    INTERNET PROGRAMIRANJE I | 2010
    
    -->
    
    116
    
    7.4.5. % (procenat) Preračunava preostalu razliku između dva broja nakon prvog djeljenja. <script language=’’text/javasctipt’’> Preračunava preostalu razliku između dvije varijable nakon prvog djeljenja. <script language=’’text/javasctipt’’>
    INTERNET PROGRAMIRANJE I | 2010
    
    -->
    
    117
    
    7.4.6. ++ (automatsko uvećanje) Povećava vrijednost broja za jedan.
    
    <script language=’’text/javasctipt’’> Povećava vrijednost varijable za jedan. <script language=’’text/javasctipt’’>
    INTERNET PROGRAMIRANJE I | 2010
    
    -->
    
    118
    
    7.4.7. – (automatsko umanjenje) Umanjuje vrijednost broja za jedan. <script language=’’text/javasctipt’’>
    
    Umanjuje vrijednost varijable za jedan. <script language=’’text/javasctipt’’>
    INTERNET PROGRAMIRANJE I | 2010
    
    -->
    
    119
    
    7.4.8. –var (postavljanje negativne vrijednosti) Negira virjednost varijable. <script language=’’text/javasctipt’’>
    
    INTERNET PROGRAMIRANJE I | 2010
    
    
    
    120
    
    PRIMJER 33 :: Arithmatičke funkcije <script type="text/javascript"> var broj11 = 15; var broj12 = 13; var rezultat11 = broj11 + broj12; var broj21 = 35; var broj22 = 13; var rezultat21 = broj21 - broj22; var broj31 = 8; var broj32 = 7; var rezultat31 = broj31 * broj32; var broj41 = 64; var broj42 = 8; var rezultat41 = broj41 / broj42; var broj51 = 28; var broj52 = 5; var rezultat51 = broj51 % broj52; var broj61 = 18; var rezultat61 = ++broj61;
    
    INTERNET PROGRAMIRANJE I | 2010
    
    var broj71 = 18; var rezultat71 = --broj71;
    
    121
    
    var broj81 = 18; var rezultat81 = -broj81; <script type="text/javascript"> document.write("Rezutat operacije + : " + rezultat11 + "
    "); document.write("Rezutat operacije - : " + rezultat21 + "
    "); document.write("Rezutat operacije * : " + rezultat31 + "
    ");
    
    INTERNET PROGRAMIRANJE I | 2010
    
    document.write("Rezutat operacije / : " + rezultat41 + "
    "); document.write("Rezutat operacije % : " + rezultat51 + "
    "); document.write("Rezutat operacije ++ : " + rezultat61 + "
    "); document.write("Rezutat operacije -- : " + rezultat71 + "
    "); document.write("Rezutat operacije - : " + rezultat81 + "
    ");
    
    122
    
    7.5. Dodjela Vrijednosti Dodjela vrijednosti se odnosi na dodjelu sadržaja definisanim varijablma.
    
    7.5.1. = (jednako je)
    
    Dodjeljuje vrijednost ili tekst sa desne strane varijabli definisanoj na ljevoj strani. Numerička vrijednost. <script language=’’text/javasctipt’’>
    
    Tekstutalni sadržak <script language=’’text/javasctipt’’>
    INTERNET PROGRAMIRANJE I | 2010
    
    // -->
    
    123
    
    7.5.2. += (plus jedako je)
    
    Sumira ili povezuje dvije varijable ili varijablu i neku vrijednost, te dobijeni rezultat dodjeljuje varijabli sa ljeva. Numberička vrijednost. <script language=’’text/javasctipt’’>
    
    Tekstualni sadržaj <script language=’’text/javasctipt’’>
    
    INTERNET PROGRAMIRANJE I | 2010
    
    
    
    124
    
    7.5.3. -= (minus jednako je) Oduzima dvije varijable ili varijablu i neku vrijednost, te dobijeni rezultat dodjeljuje varijabli sa ljeva. Numberička vrijednost. <script language=’’text/javasctipt’’>
    
    INTERNET PROGRAMIRANJE I | 2010
    
    
    
    125
    
    7.5.4. *= (puta jednako je) Množi dvije varijable ili varijablu i neku vrijednost, te dobijeni rezultat dodjeljuje varijabli sa ljeva. Numberička vrijednost. <script language=’’text/javasctipt’’>
    INTERNET PROGRAMIRANJE I | 2010
    
    // -->
    
    126
    
    7.5.5. /= (podjeljeno jednako je) Dijeli dvije varijable ili varijablu i neku vrijednost, te dobijeni rezultat dodjeljuje varijabli sa ljeva. Numberička vrijednost. <script language=’’text/javasctipt’’>
    
    INTERNET PROGRAMIRANJE I | 2010
    
    
    
    127
    
    7.5.6. %= (procenat jednako je) Kalkuše preostalu virjednosti dviju varijable ili varijablu i neku vrijednost nakon prvog djeljenja, te dobijeni rezultat dodjeljuje varijabli sa ljeva. Numberička vrijednost. <script language=’’text/javasctipt’’>
    INTERNET PROGRAMIRANJE I | 2010
    
    // -->
    
    128
    
    PRIMJER 34 :: Arithmatičke funkcije i funkcije dodjele vrijednosti <script type="text/javascript"> var broj11 = 15; var broj12 = 13; broj11 += broj12; var str11 = "OVO JE"; var str12 = " JAVASCRIPT KOD"; str11 += str12; var broj21 = 35; var broj22 = 13; broj21 -= broj22; var broj31 = 8; var broj32 = 7; broj31 *= broj32; var broj41 = 64; var broj42 = 8; broj41 /= broj42;
    
    INTERNET PROGRAMIRANJE I | 2010
    
    var broj51 = 28; var broj52 = 5; broj51 %= broj52;
    
    129
    
    <script type="text/javascript"> document.write("Rezutat operacije += : " + broj11 + "
    "); document.write("Rezutat operacije += : " + str11 + "
    "); document.write("Rezutat operacije -= : " + broj21 + "
    "); document.write("Rezutat operacije *= : " + broj31 + "
    "); document.write("Rezutat operacije /= : " + broj41 + "
    "); document.write("Rezutat operacije %= : " + broj51 + "
    "); 7.6. Događaji (events) Poziva javascript funkcije koje su definisane ili na sanmoj Web stranici ili u eksternoj
    
    javascpirt datoteci. Definiše se unutar elementa te se isti događaj izvršava u ovisnosti od trigera za koji je definisan.
    
    
    
     onload o Funkcija da se pokrene kada se dokument učitava  onunload o Funkcija da se pokrene kada se izlazi iz dokumenta  onblur o Funkcija da se pokrene kada se izgubi fokus elementa  onchange o Funkcija da se pokrene kada promjene elementa  onfocus o Funkcija da se pokrene kada elementa dobije fokus  onreset o Funkcija da se pokrenu kada se forma resetuje  onselect o Funkcija da se pokrenu kada je izabrana elementa  onsubmit o Funkcija da se pokrene kada se podnosi forma  onabort o Funkcija da se pokrene kada se učitavanje slika je prekinuta  onkeydown o Funkcija da se pokrenu kada se pritisne taster  onkeypress o Funkcija da se pokrenu kada se pritisne i pui taster  onkeyup o Funkcija da se pokrene kada se putsi taster  onclick o Funkcija da se pokrene na klik miša  ondblclick o Funkcija da se pokrene na dupli klik miša  onmousedown o Funkcija da se pokrene kada se pritisne dugme miša  onmousemove o Funkcija da se pokrene kada se pređe mišom preko definisanog elementa  onmouseout o Funkcija da se pokrene kada se skloni miš sa definisanog elementa  onmouseover o Funkcija da se pokrene kada se pređe mišom preko definisanog elementa  onmouseup o Funkcija da se pokrene kada se pusti dugme miša
    
    INTERNET PROGRAMIRANJE I | 2010
    
    Trigeri događaja
    
    130
    
    PRIMJER 35 :: Funkcije i događaji
    
    INTERNET PROGRAMIRANJE I | 2010
    
    
    
    131
    
    <script type="text/javascript"> function proba() { alert(mojaForma.hd1.value); alert(document.getElementById("area1").value); var myselect = document.getElementById("slc1"); myselect.remove(myselect.length - 1); myselect.add(new Option("ZADNJI", myselect.length), null); alert(document.getElementById("slc1").value); myselect.selectedIndex = myselect.length - 1; alert(document.getElementById("slc1").value); } function sadrzaj(elemID) { var elem = document.getElementById(elemID); var elemVal = elem.value; alert(elemVal); } function stil() { document.getElementById("fld1").style.backgroundColor = "Red" }

    Text box1:
    
    Text box2:
    
    Password:
    
    Chekcbox1 Chekcbox2 Chekcbox3
    
    
    
    Radiobutton1-1 Radiobutton1-2 Radiobutton1-3
    
    Radiobutton2-1 Radiobutton2-2 Radiobutton2-3
    
    
    
    SELECT 1 : <select name="slc1" id="slc1"> OPT1 OPT2 OPT3 SELECT 2 : <select name="slc2" id="Select2"> OPT1 OPT2 OPT3
    
    
    
    

    
    
    INTERNET PROGRAMIRANJE I | 2010
    
    
    
    132