-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
160 lines (153 loc) · 8.29 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>PZI - Vježba 3</title>
<link rel="stylesheet" href="https://pro.fontawesome.com/releases/v5.10.0/css/all.css">
<link rel="stylesheet" href="styles/style.css"/>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<header>
<label>Vježba 4</label>
<label>PZI</label>
<div id="search-container">
<i class="fa fa-search search-icon"></i>
<input type="text" id="search-box" placeholder="search"/>
</div>
</header>
<main>
<nav>
<div class="logo-container">
<img src="images/fesb-logo.png"/>
</div>
<div class="links-container">
<a href="">Vježba 1</a>
<a href="">Vježba 2</a>
<a href="../Vjezba3">Vježba 3</a>
<a href="" class="selected">Vježba 4</a>
</div>
</nav>
<div id="slider">
<div id="main-picture-container">
<img alt="picture" src="images/cetina.jpg"/>
</div>
<div id="thumbnails-container">
<div class="thumbnail selected">
<img src="images/thumbnails/cetina.jpg"/>
</div>
<div class="thumbnail">
<img src="images/thumbnails/kozjak.jpg"/>
</div>
<div class="thumbnail">
<img src="images/thumbnails/sibenik.jpg"/>
</div>
<div class="thumbnail">
<img src="images/thumbnails/primosten.jpg"/>
</div>
<div class="thumbnail">
<img src="images/thumbnails/svilaja.jpg"/>
</div>
</div>
</div>
<h1>Vježba 3 - napredniji HTML + CSS</h1>
<div id="cards-container">
<article class="card">
<i class="fa fa-times delete-button"></i>
<img src="images/newsHeadings/cetina.jpg" alt="cetina"/>
<h3>Cetina</h3>
<p>
Cetina izvire na nadmorskoj visini od 385 m u sjeverozapadnim obroncima Dinare
blizu sela Cetina, 7 km sjeverno od Vrlike, a po kojem je rijeka i dobila ime.
Izvor Cetine je jezero duboko preko stotinu metara.
</p>
<p>
Blizu Vrlike se nalazi Peručko jezero, umjetno stvoreno branom na Cetini 25 km
nizvodno. Nakon jezera rijeka prolazi krškim područjem i Sinjskim poljem prema
gradu Sinju. Cetina pod Gardunom, kod grada Trilja, napušta Sinjsko polje, ulazi
u kanjon te teče prema jugu. Nad kanjonom je utvrda Nutjak. Obale su u kanjonu
bliže i više, a rijeka duboka i spora. Nekad je voda brzo tekla i okretala brojne mlinove,
ali su je brane usporile.
</p>
</article>
<article class="card">
<i class="fa fa-times delete-button"></i>
<img src="images/newsHeadings/kozjak.jpg" alt="kozjak"/>
<h3>Kozjak</h3>
<p>
Kozjak je planina koja sa sjeverne strane okružuje grad Kaštela.
Njegova je južna padina vrlo strma i klisurasta, a sjeverni kameniti
obronci postupno prelaze u valovitu visoravan Dalmatinske Zagore.
</p>
<p>
To je u hrvatskom planinarstvu najpoznatije popularno značenje naziva Kozjak,
za razliku od manje poznatog ali znatno višega Velikog Kozjaka iznad Kijeva u Dalmatinskoj Zagori,
1207 m.
</p>
<p>
Najupečatljiviji dio Kozjaka je južna stijena (16 km), koja je ujedno najduža u Hrvatskoj,
mada razmjerno male visine (50 – 250 m).
</p>
</article>
<article class="card">
<i class="fa fa-times delete-button"></i>
<img src="images/newsHeadings/primosten.jpg" alt="primosten"/>
<h3>Primošten</h3>
<p>
Tijekom turske invazije 1542., otočić na kojemu se nalazi Primošten je
bio zaštićen zidovima i kulama i sa pomičnim mostom koji ga je spajao
s kopnom. Kad su se Turci povukli, most je zamijenjen nasipom, a naselje
je nazvano "Primošten", od riječi "primostiti" (premostiti).
</p>
<p>
Primošten je poznat po svojim velikim i predivnim vinogradima.
Fotografija jednog od primoštenskih vinograda visi na zidu zgrade
središta UN-a u New Yorku. Razmatra se uvrštenje vinograda u UNESCO-v popis baštine.
</p>
<p>
Najveća plaža u Primoštenu je Raduča, a postoji i Mala Raduča, koja je izabrana
za jednu od 10 najljepših plaža u Hrvatskoj.
</p>
</article>
<article class="card">
<i class="fa fa-times delete-button"></i>
<img src="images/newsHeadings/sibenik.jpg" alt="kozjak"/>
<h3>Katedrala</h3>
<p>
Katedrala Sv. Jakova u Šibeniku najznačajnije je graditeljsko ostvarenje
15. i 16. st. na tlu Hrvatske. Zbog svojih iznimnih vrijednosti katedrala je
2000. godine uvrštena u UNESCO-ov popis svjetskog kulturnog nasljeđa.
</p>
<p> Gradnja nove katedrale simbolički je bila kulminacija višestoljetnog stremljenja grada,
da se odvoji od trogirske biskupije te da i uz vlastitu crkvu stekne i komunalnu autonomiju.
Podignuta je na južnoj strani središnjeg starog gradskog trga, na mjestu romaničke crkve sv. Jakova.
Ideja o gradnji velikog katedralnog hrama datira od 1298. godine. kada je Šibenik dobio vlastitu
biskupiju i naslov grada. Odluka o gradnji i početku pripremnih radova donesena je 1402. godine.
Gradnja je međutim, započela tek 1431. godine i trajala uz prekide do 1536. godine.
</p>
</article>
<article class="card">
<i class="fa fa-times delete-button"></i>
<img src="images/newsHeadings/svilaja.jpg" alt="svilaja"/>
<h3>Svilaja</h3>
<p>
Svilaja je planina u Dalmatinskoj Zagori, usporedna s višim sjevernijim
lancem Dinara-Troglav. Pruža se smjerom sjeverozapad-jugoistok između Sinjskoga
i Petrovog polja u dužini oko 30 km.
</p>
<p>
Najviši je južni vrh Svilaje (Bat) 1508 m iznad Sinja. Sjevernije su još važniji
vrhovi Jančak 1483 m, Kita 1413 m, Turjača 1340 m , Mala Svilaja 1472 m i Lisina 1301 m
iznad Vrlike. Od najbližeg grebena Veliki Kozjak (1207 m) koji je sjeverni nastavak Svilaje,
ova je odvojena nižim sedlom Lemeš (860 m) iznad sela Maovice. Najveći dio lanca Svilaje
je krški greben s naizmjeničnim nizom vrhova i ponikava (vrtača), te više krških jama i špilja.
</p>
</article>
</div>
</main>
<footer>
Copyright Marin Barać @FESB 2020 PZI
</footer>
</body>
</html>