Do you speak HTML?
-
Upload
pogled-kroz-prozor -
Category
Education
-
view
1.531 -
download
1
description
Transcript of Do you speak HTML?
![Page 1: Do you speak HTML?](https://reader036.fdocuments.us/reader036/viewer/2022062319/5562c929d8b42aaf178b5278/html5/thumbnails/1.jpg)
Uvod u HTML – jezik za opis web stranicaRadionica – voditeljica Kristina Novak
Do you speak HTML?
Cernik, 27. 11. 2013.
![Page 2: Do you speak HTML?](https://reader036.fdocuments.us/reader036/viewer/2022062319/5562c929d8b42aaf178b5278/html5/thumbnails/2.jpg)
ŠKOLSKI WEB – „IZVANA”
![Page 3: Do you speak HTML?](https://reader036.fdocuments.us/reader036/viewer/2022062319/5562c929d8b42aaf178b5278/html5/thumbnails/3.jpg)
ŠKOLSKI WEB – „IZNUTRA”
![Page 4: Do you speak HTML?](https://reader036.fdocuments.us/reader036/viewer/2022062319/5562c929d8b42aaf178b5278/html5/thumbnails/4.jpg)
WEB STRANICA – današnji rad – „IZVANA”
![Page 5: Do you speak HTML?](https://reader036.fdocuments.us/reader036/viewer/2022062319/5562c929d8b42aaf178b5278/html5/thumbnails/5.jpg)
WEB STRANICA – današnji rad – „IZNUTRA”
![Page 6: Do you speak HTML?](https://reader036.fdocuments.us/reader036/viewer/2022062319/5562c929d8b42aaf178b5278/html5/thumbnails/6.jpg)
HTML kod
<oznake> atributi ˝vrijednosti atributa˝
<oznaka atribut=˝vrijednost_atributa˝>
</kraj_oznake>
![Page 7: Do you speak HTML?](https://reader036.fdocuments.us/reader036/viewer/2022062319/5562c929d8b42aaf178b5278/html5/thumbnails/7.jpg)
Osnovi HTML kod
<html><head>
zaglavlje – naslovi, jezik stranice</head><body>
tijelo – sadržaj stranice</body></html>
![Page 8: Do you speak HTML?](https://reader036.fdocuments.us/reader036/viewer/2022062319/5562c929d8b42aaf178b5278/html5/thumbnails/8.jpg)
<html><head></head><body>Ovo je moja prva web stranica pisana HTML kodom. </body></html>
PISANJE TEKSTA<body> tekst </body>
![Page 9: Do you speak HTML?](https://reader036.fdocuments.us/reader036/viewer/2022062319/5562c929d8b42aaf178b5278/html5/thumbnails/9.jpg)
<html><head></head><body>Ovo je moja prva <b> web stranica </b> pisana HTML kodom. </body></html>
PODEBLJAVANJE SLOVA<b> tekst </b>
![Page 10: Do you speak HTML?](https://reader036.fdocuments.us/reader036/viewer/2022062319/5562c929d8b42aaf178b5278/html5/thumbnails/10.jpg)
<html><head></head><body>Ovo je moja prva <b> web stranica </b> pisana <i> HTML kodom. </i> </body></html>
UKOŠAVANJE SLOVA<i> tekst </i>
![Page 11: Do you speak HTML?](https://reader036.fdocuments.us/reader036/viewer/2022062319/5562c929d8b42aaf178b5278/html5/thumbnails/11.jpg)
<html><head></head><body>Ovo je moja prva <b> web stranica </b> pisana <i> <u> HTML kodom. </u> </i> </body></html>
PODCRTAVANJE SLOVA<u> tekst </u>
![Page 12: Do you speak HTML?](https://reader036.fdocuments.us/reader036/viewer/2022062319/5562c929d8b42aaf178b5278/html5/thumbnails/12.jpg)
<html><head></head><body><font color=˝red˝> Ovo je moja prva <b> web stranica </b> pisana <i> <u> HTML kodom. </u> </i> </font></body></html>
OBLIKOVANJE SLOVA - boja<font color=˝red˝> tekst </font>
P
![Page 13: Do you speak HTML?](https://reader036.fdocuments.us/reader036/viewer/2022062319/5562c929d8b42aaf178b5278/html5/thumbnails/13.jpg)
<html><head></head><body><font color=˝red˝> Ja se zovem Kristina. <br> Ovo je moja prva <b> web stranica </b> pisana <i> <u> HTML kodom. </u> </i> </font></body></html>
PRIJELOM RETKA<br>
![Page 14: Do you speak HTML?](https://reader036.fdocuments.us/reader036/viewer/2022062319/5562c929d8b42aaf178b5278/html5/thumbnails/14.jpg)
<html><head></head><body><font color=˝red˝ size=˝2˝> Ja se zovem Kristina. <br> Ovo je moja prva <b> web stranica </b> pisana <i> <u> HTML kodom. </u> </i> </font></body></html>
OBLIKOVANJE SLOVA - veličina<font size=˝2˝> tekst </font>
![Page 15: Do you speak HTML?](https://reader036.fdocuments.us/reader036/viewer/2022062319/5562c929d8b42aaf178b5278/html5/thumbnails/15.jpg)
<html><head></head><body><font color=˝red˝ size=˝2˝ face=˝Verdana˝> Ja se zovem Kristina. <br> Ovo je moja prva <b> web stranica </b> pisana <i> <u> HTML kodom. </u> </i> </font></body></html>
OBLIKOVANJE SLOVA - font<font face=˝Verdana˝> tekst
</font>
![Page 16: Do you speak HTML?](https://reader036.fdocuments.us/reader036/viewer/2022062319/5562c929d8b42aaf178b5278/html5/thumbnails/16.jpg)
<html><head></head><body><p> <font color=˝red˝ size=˝2˝ face=˝Verdana˝> Ja se zovem Kristina. <br> Ovo je moja prva <b> web stranica </b> pisana <i> <u> HTML kodom. </u> </i> </font> </p><p> Idem u OŠ „Matija Gubec” Cernik. </p></body></html>
ODLOMCI <p> tekst </p>
P
![Page 17: Do you speak HTML?](https://reader036.fdocuments.us/reader036/viewer/2022062319/5562c929d8b42aaf178b5278/html5/thumbnails/17.jpg)
<html><head></head><body><p align=˝left˝> <font color=˝red˝ size=˝2˝ face=˝Verdana˝> Ja se zovem Kristina. <br> Ovo je moja prva <b> web stranica </b> pisana <i> <u> HTML kodom. </u> </i> </font> </p><p align=˝center˝ > Idem u OŠ „Matija Gubec” Cernik. </p></body></html>
PORAVNANJE ODLOMKA<p align=˝left˝> tekst </p>
![Page 18: Do you speak HTML?](https://reader036.fdocuments.us/reader036/viewer/2022062319/5562c929d8b42aaf178b5278/html5/thumbnails/18.jpg)
<html><head></head><body bgcolor=˝silver˝><p align=˝left˝> <font color=˝red˝ size=˝2˝ face=˝Verdana˝> Ja se zovem Kristina. <br> Ovo je moja prva <b> web stranica </b> pisana <i> <u> HTML kodom. </u> </i> </font> </p><p align=˝center˝ > Idem u OŠ „Matija Gubec” Cernik. </p></body></html>
BOJA POZADINE STRANICE<body bgcolor=˝silver˝>
![Page 19: Do you speak HTML?](https://reader036.fdocuments.us/reader036/viewer/2022062319/5562c929d8b42aaf178b5278/html5/thumbnails/19.jpg)
<html><head>
<title>Dobrodošli!</title></head><body bgcolor=˝silver˝><p align=˝left˝> <font color=˝red˝ size=˝2˝ face=˝Verdana˝> Ja se zovem Kristina. <br> Ovo je moja prva <b> web stranica </b> pisana <i> <u> HTML kodom. </u> </i> </font> </p><p align=˝center˝ > Idem u OŠ „Matija Gubec” Cernik. </p></body></html>
NASLOVNA TRAKA - KARTICA<title>tekst</title>
![Page 20: Do you speak HTML?](https://reader036.fdocuments.us/reader036/viewer/2022062319/5562c929d8b42aaf178b5278/html5/thumbnails/20.jpg)
<html><head>
<title>Dobrodošli!</title></head><body bgcolor=˝silver˝><p align=˝left˝> <font color=˝red˝ size=˝2˝ face=˝Verdana˝> Ja se zovem Kristina. <br> Ovo je moja prva <b> web stranica </b> pisana <i> <u> HTML kodom. </u> </i> </font> </p><p align=˝center˝ > Idem u OŠ „Matija Gubec” Cernik. Posjetite je na <a href=˝http://www.os-matija-gubec.hr/˝>webu. </a> </p></body></html>
POVEZNICA - HIPERVEZA<a href=˝http://www...˝>tekst</a>
P
![Page 21: Do you speak HTML?](https://reader036.fdocuments.us/reader036/viewer/2022062319/5562c929d8b42aaf178b5278/html5/thumbnails/21.jpg)
<html><head>
<title>Dobrodošli!</title></head><body bgcolor=˝silver˝><p align=˝left˝> <font color=˝red˝ size=˝2˝ face=˝Verdana˝> Ja se zovem Kristina. <br> Ovo je moja prva <b> web stranica </b> pisana <i> <u> HTML kodom. </u> </i> </font> </p><p align=˝center˝ > Idem u OŠ „Matija Gubec” Cernik. Posjetite je na <a href=˝http://www.os-matija-gubec.hr/˝>webu. </a> </p><p align=˝center˝> <img src=˝skola.JPG˝></p></body></html>
UMETANJE SLIKE<img src=˝ime_slike.jpg˝>
![Page 22: Do you speak HTML?](https://reader036.fdocuments.us/reader036/viewer/2022062319/5562c929d8b42aaf178b5278/html5/thumbnails/22.jpg)
<html><head>
<title>Dobrodošli!</title></head><body bgcolor=˝silver˝><p align=˝left˝> <font color=˝red˝ size=˝2˝ face=˝Verdana˝> Ja se zovem Kristina. <br> Ovo je moja prva <b> web stranica </b> pisana <i> <u> HTML kodom. </u> </i> </font> </p><p align=˝center˝ > Idem u OŠ „Matija Gubec” Cernik. Posjetite je na <a href=˝http://www.os-matija-gubec.hr/˝>webu. </a> </p><p align=˝center˝> <img src=˝skola.JPG˝></p></body></html>
Zadatak: Oboji tekst u drugom odlomku po želji. Promijeni veličinu i vrstu slova.
![Page 23: Do you speak HTML?](https://reader036.fdocuments.us/reader036/viewer/2022062319/5562c929d8b42aaf178b5278/html5/thumbnails/23.jpg)
<html><head>
<title>Dobrodošli!</title></head><body bgcolor=˝silver˝><p align=˝left˝> <font color=˝red˝ size=˝2˝ face=˝Verdana˝> Ja se zovem Kristina. <br> Ovo je moja prva <b> web stranica </b> pisana <i> <u> HTML kodom. </u> </i> </font> </p><p align=˝center˝> <font color=˝blue˝ size=˝4˝ face=˝Arial˝> Idem u OŠ „Matija Gubec” Cernik. Posjetite je na <a href=˝http://www.os-matija-gubec.hr/˝>webu. </a> </font> </p>
<p align=˝center˝> <img src=˝skola.JPG˝> </p></body></html>
Rješenje
![Page 24: Do you speak HTML?](https://reader036.fdocuments.us/reader036/viewer/2022062319/5562c929d8b42aaf178b5278/html5/thumbnails/24.jpg)
<html><head>
<title>Dobrodošli!</title><meta http-equiv=˝Content-Type˝ content=˝text/html˝
charset=˝windows-1250˝></head><body bgcolor=˝silver˝><p align=˝left˝> <font color=˝red˝ size=˝2˝ face=˝Verdana˝> Ja se zovem Kristina. <br> Ovo je moja prva <b> web stranica </b> pisana <i> <u> HTML kodom. </u> </i> </font> </p><p align=˝center˝ > Idem u OŠ „Matija Gubec” Cernik. Posjetite je na <a href=˝http://www.os-matija-gubec.hr/˝>webu. </a> </p><p align=˝center˝> <img src=˝skola.JPG˝></p></body></html>
KODNA STRANICA<meta ...>
![Page 25: Do you speak HTML?](https://reader036.fdocuments.us/reader036/viewer/2022062319/5562c929d8b42aaf178b5278/html5/thumbnails/25.jpg)
A sada malo samostalnog kodiranja....
Dodajte na stranicu po želji tekst, sliku i oblikujte ih...
![Page 26: Do you speak HTML?](https://reader036.fdocuments.us/reader036/viewer/2022062319/5562c929d8b42aaf178b5278/html5/thumbnails/26.jpg)
... ovo je tek početak...