PRIPREMA ZA VJEŽBU
1. Na koje se načine u HTML-u mogu naznačiti boje (navedite bar tri različita načina)? Navedite pet različitih imena boja.
HTML boje navedene su s unaprijed definiranim imenima boja ili s RGB, HEX, HSL, RGBA ili HSLA vrijednostima.
2. Što znači kratica CSS? Za što se koristi CSS?
CSS je kratica za C ascading S tyle S heets, opisuje kako se HTML elementi trebaju prikazati na zaslonu, papiru ili na drugim medijima
3. Kako se koristi „inline“ CSS?
Inline – dodavanje CSS-a pomoću <style> atributa unutar HTML elemenata
4. Što su poveznice? Koje vrste poveznica znate?
Poveznica ili link je pojam koji označava vezu između dvije web-stranice. Obično se pod tim pojmom misli na dijelove web-stranica (dio teksta ili slika) preko kojih web-preglednik (browser) prelazi na neku drugu stranicu.
vrste: http, news, gopher, ftp
IZVOĐENJE VJEŽBE
1. Stilovi boja
A.
<html>
<body>
<h1>Prednosti:</h1>
<p style=”background-color:white;”>Dobre osobine su poželjna stvar za osobu bilo kojeg spola ili dobi. Kako bi postali takve osobe trebamo preispitivati sve svoje odluke.</p>
<h1 style=”background-color:black;color:white;”>Nedostatci</h1>
<p style=”background-color:black
;color:white;”> Nedostatci dobrih osobina su to što si savršen! </p>
</body>
</html>
B.
<!DOCTYPE html>
<html>
<body>
<h1 style=”background-color:green;color:red;text-align:center;border:5px solid rgb(144,238,144)”>PROLJEĆE
</h1>
<h1 style=”background-color:yellow;color:orange;text-align:center;border:5px solid rgb(154, 64, 0, 1)”>LJETO
</h1>
<h1 style=”background-color:brown;color:yellow;text-align:center;border:5px solid rgb(81, 6, 7)”>JESEN
</h1>
<h1 style=”background-color:gray;color:white;text-align:center;border:5px solid rgb(30, 76, 90)”>ZIMA
</h1>
</body>
</html>
2. HTML poveznice
<!DOCTYPE html>
<html>
<body>
<h1> Najznačajniji zagrebački lokaliteti </h1>
<p> Zagreb je grad pun različitih lokaliteta koji ga zapravo ističu od ostalih gradova u Hrvatskoj. Npr. Park Bundek – omogućuje građanima Grada Zagreba boravak u prirodi, te različite vrste rekreacije i odmora uz šetnju. Zatim imamo Zagebačku katedralu koja je ujedno i najviša građevina u cijeloj Hrvatski.Te kao šećer na kraju Tehnički Muzej Nikole Tesle, koji sadrži mnogo zabavnih i edukacijski nastrojenih programa. Jedan od najpoznatijih mjesta u Zagrebu je Trg bana Jelačića koji je zapravo centar grada. Također imamo Gornji i Donji Grad koji povezani.</p>
<a href=”https://www.infozagreb.hr/lifestyle/sport-i-rekreacija/rekreacijski-centri/bundek” target=”_blank”>Posjetite Bundek!</a>
<br>
<a href=”http://www.zg-nadbiskupija.hr/katedrala/povijest”target=”_blank”> Zagrebačka katedrala</a>
<br>
<a href=”https://tmnt.hr/hr-hr/”target=”_blank”>Tehnički muzej Nikole Tesle</a>
<br>
<a href=”https://www.infozagreb.hr/landing/korean/trg-bana-josipa-jelacica-54a11ce4b307b”target=”_blank”>Trg bana Jelačića</a>
<br>
<a href=”http://www.kartazagreba.info/karta-donji-grad.php”target=”_blank”>Karta donjeg grada</a>
</body>
</html>
3. HTML – slike
<!DOCTYPE html>
<html>
<body>
<h1> Najznačajniji zagrebački lokaliteti </h1>
<p> Zagreb je grad pun različitih lokaliteta koji ga zapravo ističu od ostalih gradova u Hrvatskoj. Npr. Park Bundek – omogućuje građanima Grada Zagreba boravak u prirodi, te različite vrste rekreacije i odmora uz šetnju. Zatim imamo Zagebačku katedralu koja je ujedno i najviša građevina u cijeloj Hrvatski. Jedno od najpoznatijih mjesta u Zagrebu je Trg bana Jelačića koji je zapravo centar grada. Također imamo Gornji i Donji Grad koji povezani čine grad Zagreb. Te kao šećer na kraju Tehnički Muzej Nikole Tesle, koji sadrži mnogo zabavnih i edukacijski nastrojenih programa.</p>
<a href=”https://www.infozagreb.hr/lifestyle/sport-i-rekreacija/rekreacijski-centri/bundek” target=”_blank”>Posjetite Bundek!</a>
<br>
<img src=”https://www.infozagreb.hr/media/places/large_bundek1-54d0c975856c6.jpg”alt=”Jezero na Bundeku”style=”width:300px;height:300px;”>
<br>
<a href=”http://www.zg-nadbiskupija.hr/katedrala/povijest”target=”_blank”> Zagrebačka katedrala</a>
<br>
<img src=”https://upload.wikimedia.org/wikipedia/commons/b/b9/Zagreb_Cathedral_2020.jpg”alt=”Zagrebačka katedrala”style=”width:300px;height:300px;”>
<br>
<a href=”https://tmnt.hr/hr-hr/”target=”_blank”>Tehnički muzej Nikole Tesle</a>
<br>
<img src=”https://www.zgkult.eu/wp-content/uploads/2020/02/F16-Demonstracijski-kabinet-Nikola-Tesla-768×495.jpg”alt=”Tehnički muzej Nikole Tesle”style=”width:300px;height:300px;”>
<br>
<a href=”https://www.infozagreb.hr/landing/korean/trg-bana-josipa-jelacica-54a11ce4b307b”target=”_blank”>Trg bana Jelačića</a>
<br>
<img src=”https://upload.wikimedia.org/wikipedia/commons/1/10/Trg_bana_Jelacica_Zagreb_30102012_2_roberta_f.jpg”alt=”Trg bana Jelačića”style=”width:300px;height:300px;”>
<br>
<a href=”http://www.kartazagreba.info/karta-donji-grad.php”target=”_blank”>Karta donjeg grada</a>
<br>
<img src=”https://croatia4travel.com/wp-content/uploads/zagreb-downtown-photo1.jpg”alt=”Donji Grad”style=”width:300px;height:300px;”>
<br>
</body>
</html>
