HTML
HTMLMATEA MUSLADINFAKULTET ELEKTROTEHNIKE, STROJARSTVA I
BRODOGRADNJESPLIT, prosinac 2014.
SADRAJ:Uvod
Struktura2.1. Pravila2.1.1.Ugnjedeni tagovi2.2. HTML kostur2.3.
Oblikovanje2.3.1.Oblikovanje teksta2.3.2.Povezivanje2.3.3Boje i
slike
Zakljuak
Literatura
1. Uvod HyperText Markup Language
jezik kojim definiramo sadraj - elemente (naslove, tekst,
poveznice, slike) na web stranici jezik za oznaavanje
hiperteksta31. Uvodizumitelj Sir TimBerners Lee
engleski znanstvenik (otac interneta)
utemeljitelj World Wide Web-a (skraeno: WWW, W3, Web)
CERN 1989.g.
WWW: besplatna i jednostavna te najkoritenija usluga
Interneta
omoguava dohvaanje hipertekstualnih dokumenata
Slika 1: Tim Berners Lee
41. Uvoddanas predsjednik World Wide Web konzorcija
W3C brine se o standardizaciji web tehnologija i razvoju
Web-a
odlikovan vitekom titulom britanske kraljevske kue (Sir Tim
B.Lee)
Slika 2: Olimpijske igre-London,2012.
2. Struktura HTML-a
2.1. Pravila:
otvaranje taga sadraj (tekst ili drugi tagovi)
zatvaranje tagaSlika 3: Markup jezik i tagovi HTML jezik se
sastoji od tagova (engl. tags)
tag je dio teksta koji je definiran izmeu znakova ()
razlikujemo: - otvoreni: - zatvoreni:
tagovi se uvijek pojavljuju u parovima
62. Struktura HTML-a
2.1.1. Ugnjedeni tagovi:
Slika 5: Neispravno pisanje tagova ne smije doi do krianja
tagovaSlika 4: Ispravno pisanje tagovaISPRAVNO:< tag1 ><
tag2 >
2. par1. parNEISPRAVNO:< tag1 >< tag2 >
72. Struktura HTML-a
2.2. HTML kostur:
< html > < head > ZAGLAVLJE < title > Naa prva
stranica < body > Tekst na mojoj prvoj stranici KRAJ HTML
DOKUMENTANaslov straniceVidljivi sadraj web stranice tagovi se mogu
otvoriti i zatvoriti u istom retku
u HTML-u razmaci nisu bitniSlika 6: Osnovni HTML kostur
2.3. Oblikovanje
2.3.1. Oblikovanje teksta Slova: (tag < font >)
- tag piemo u glavnom dijelu HTML "kostura", izmeu tagova i
- ispisati e se tekst crne boje u tipu slova Times New RomanHTML
kod:
Na tekst u HTML-u
HTML ispis:
Na tekst u HTML-u Slika 7: Osnovni HTML kostur
2.3. Oblikovanje
2.3.1. Oblikovanje teksta naslovi:HTML kod:Prikaz teksta u web
pregledniku Razina 1 Razina 1 Razina 2 Razina 2 Razina 3 Razina 3
Razina 4 Razina 4 Razina 5 Razina 5 Razina 6 Razina 6Slika 8:
Prikaz naslova
2.3. Oblikovanje
2.3.1. Oblikovanje teksta: postoje tagovi za podebljano, ukoeno,
podcrtano oblikovanje teksta
mogunost pozicioniranja teksta lijevo, desno ili na sredinu
HTML kod:HTML ispis:align ="left"Na tekst.align = "center"Na
tekst.align ="right"Na tekst.HTML kod:HTML ispis:< b > tekst
tekst< i > tekst tekst< u > tekst tekstSlika 9: Prikaz
tagova za oblikovanje teksta
2.3. Oblikovanje
2.3.1. Oblikovanje teksta: indeks (engl. subscript) tag < sub
>
eksponent (engl. superscript) - tag < sup >
HTML kod:Prikaz teksta u web pregledniku 8 8 = 8 2 8 8 = 8H 2
0HOSlika 10: Pravilno pisanje indeksa i eksponenta
2.3. Oblikovanje
2.3.2. Povezivanje: tag - koristi se za definiranje poveznica i
oznaka web stranica
postoje tri glavne vrste poveznica: vanjske (eksterne)
http://www.nazivdomene.hr unutarnje (interne) nazivstranice.html
poveznica za e-mail [email protected] za definiranje
poveznica koristimo atribut href (engl. Hyperlink REFerence)
2.3. Oblikovanje
2.3.2. Povezivanje: poveznicama mijenjamo izgled ako u tagu
dodamo sljedee atribute: vlink boja posjeenih stranica (vlink
="red") link boja poveznica (link ="blue") alink boja aktivne
povezniceHTML kod:
HTML ispis:http://www.fesb.hrSlika 11: Navoenje poveznica 14<
img src = nazivmape / slika.jpg border= 0" width= 80" height=
30"> irina slike je 80 piksela, a visina 30 piksela.
2.3. Oblikovanje
2.3.3. Boje i slike: tag < img > -dodavanje slika na web
stranicu
atributom src odabiremo slike u datotekama
veliinu slike mijenjamo pomou atributa: - width (hrv. irina) -
height (hrv. visina)
sve veliine definiraju se u pikselimaSlika 12: Oblikovanje
veliine slike 15
2.3. Oblikovanje
2.3.3. Boje i slike: za definiranje pozadinske boje koristimo
atribut bgcolor upisan u tagu
FFFF00FF6600FF0000660066330099006633FFFFFF666666000000Slika 13:
Boje u HTML-u 16
3. Zakljuak
HTML programski jezik kojim definiramo sadraj web stranici
sastoji se od tagova unutar kojih se nalazi eljeni sadraj (
sadraj )
HTML dokument se sastoji od dva dijela: - zaglavlja (engl. head)
i tijela (engl. body)
tagovi za oblikovanje teksta nalaze se u glavnom dijelu HTML
koda, izmeu tagova i
oblikovanje: , , , , , , ...
17
4. Literatura
[1] Boaji, Ivan. (2011) PHP/MySQL prirunik: HTML. Zagreb:
Algebra, str. 17-68.
[2] imec, Alen. (2012) Osnove HTML, XHTML i CSS:HTML. Zagreb:
Tehniko veleuilite, str. 10-15.
[3] Stojanov, T. (2013) Uvod u (X)HTML i CSS -skripta:HTML.
Zagreb: Tehniko veleuilite, str. 26-32.
[4] Hrnjak, Marko. (2010) HTML: prirunik [za polaznike]. Zagreb:
Algebra, str. 9-14.
18 Matea Musladin
[email protected]
Hvala na pozornosti!19
