You are on page 1of 3

I GRUPA  ISPIT IZ PRIMENE RAČUNARA – GRAFIKA 2 

Web dizajn 

1. U datom folderu na Desktopu napraviti sajt prema priloženim ekranima (videti na kraju dokumenta). 
Formatiranje i uređenost definisati u odvojenoj CSS datoteci pod nazivom ispit.css. 
2. Sajt treba da sadrži stranice (zadatak.html, kodiranje.html, layout.html i testiranje.html) i u svima 
odgovarajuću navigaciju. Svaka stranica sastoji se od headera i section. U header‐u se nalazi naslov h1, 
navigacija i pasus. Element section sadrži elemente article i figure (u ovom se nalazi slika kao img i naslov slike 
kao figcaption). 
3. U tagu <title> upisati „GRUPA 3“. Formatiranja i pozadina svih stranica treba da bude definisana prema 
sledećem:  
a. font je 8pt arial ili helvetica ili times new roman 
b. boja pozadine je #EEE sa horizontalnom gradacijom definisanom kroz CSS na sledeći način: 
background:linear‐gradient(left, #BBB 0%, #DDD 30%, #EEE 50%, #DDD 70%, #BBB 100%); 
background:‐webkit‐linear‐gradient(left, #BBB 0%, #DDD 30%, #EEE 50%, #DDD 70%, #BBB 100%); 
background:‐moz‐linear‐gradient(left, #BBB 0%, #DDD 30%, #EEE 50%, #DDD 70%, #BBB 100%);  
c. sve margine su 0. 
4. Element header koji leži uz gornju ivicu prozora (gornja i donja margina je 0, leva i desna su auto), padding sa 
svih strana je 20px, širine je 500px, sa belom bojom u pozadini, relativno pozicioniran sa veličinom fonta 1.3em i 
tekstom centriranim. 
Header sadrži naslov stranice „Kolokvijum iz WEB dizajna“ formatiran kao h1 i centriran, a takođe sadrži i 
navigaciju postavljenu u <nav> element sa marginama 0 i auto, unutrašnje odbijanje je 0 a visina ovog elementa 
je 20px. 
5.  Navigaciju čini nenumerisana lista <ul> čiji su elementi <li> postavljeni u levi blok (float:left) i prikazani bez 
simbola. 
6. Ankori u svakoj stavki prvog nivoa u navigaciji <li>: prikazani su kao block, širine 90px, sa paddingom 5x i 8px, 
pozadinom boje #49B, belom bojom teksta i bez podvlačenja. 
7. Podlista je takođe nenumerisana lista (<ul> drugi nivo) koja je sakrivena (display:none), širine 100px sa bojom u 
pozadini #69ADC9. Prilikom prelaska mišem preko stavki iz prve liste trebalo bi da se prikazuje podlista (nav 
li:hover ul) sa sledećim stilovima: prikaz je kao block, apsolutno pozicioniran sa marginama o i paddingom 0. Sve 
stavke podliste trebalo bi da se prikazuju jedna ispod druge (float:none) kada kursor miša prelazi preko stavki iz 
prve liste (nav li:hover li). 
8. Linkovi definisani stavkama podliste (nav li:hover li a) su: bez podvlačenja, ispisani belom bojom sa bojom 
pozadine #69ADC9 i donjom bordurom debljine 1px punom linijom boje #ACE. Kada kursor miša pređe preko 
linkova u podlisti menja se boja u pozadini tih linkova (nav li li a:hover) u #8BD. 

Tačke od 1 do 8 odnose se na telo i formatiranje svih stranica kao i na navigaciju koja je zajednička za sve tri stranice 
ovog sajta. Tačka 9  odnosi se na formatiranje sadržaja svih stranica. 
9. Sadržaj na svakoj stranici nalazi u elementima <article> postavljenim u jedan element <section>. Element 
<section> definisati sa: marginama 20px gore i dole, odnosno, 80px levo i desno; veličina fonta je 12pt. Svaki 
članak <article> definisati sa: veličinom teksta 12pt poravnatim po obe margine. Između elemenata <article> 
postaviti element <figure> sa veličinom fonta 10pt, uz levu ivicu tako da tekst ide oko njega. U element <figure> 
postaviti sliku širine 200px i visine 120px. Ispod te slike postaviti naslov slike (<figcaption>) kako je prikazano na 
ekranu na sledećoj strani. Sličnu strukturu napraviti i za preostale stranice.