Osnove HTML-a
Naslov rada
:
HTML
SADRŽAJ
1.
UVOD................................................................................................................................1
2.
PRAVILA PISANJA HTML-a..........................................................................................1
3.
KAKO POČETI?............................................................................................................... 2
4.
OSNOVNI ELEMENTI HTML-a.....................................................................................3
5.
GRAFIKA (SLIKE)...........................................................................................................6
6.
POVEZIVANJE DOKUMENATA.................................................................................... 7
7.
TABLICE...........................................................................................................................8
8.
IZRADA OBRAZACA................................................................................................... 10
9.
ZAKLJUČAK..................................................................................................................12

KAKO POČETI?
Za izradu HTML dokumenata dovoljan nam je najobičniji tekst editor kao što je Notepad,
internet preglednik po slobodnom izboru(po mogućnosti najmanje 2 kako bi izgled svoje
stranice provjerili sa vise preglednika, sto je neophodno jer različiti preglednici različito
tumače neke HTML identifikatore). Na kraju bilo bi poželjno da imamo i neki program za
obradu grafike (Corel Draw i Corel Photo Paint) da bi mogli kreirati i pregledati grafičke
datoteke koje ćemo ugraditi u nas HTML dokument.
Nakon sto svoj kod natipkamo u Notepad ili neki drugi tekst editor, spremimo taj dokument
na način:
File
Save as
(u dijalog prozoru prvo odaberemo folder u kojem ćemo spremiti
naš stranicu. U polje File name upišimo ime naše prve stranice, a kao ekstenziju
otkucajmo .htm ili .html (npr. "web stranica.htm"). )
Ono sto čini osnovu svakog HTML dokumenta je njegov identifikator koji internet
pregledniku govori o kojem se elementu zapravo radi kako bi ga ovaj znao pravilno prikazati.
HTML identifikatori su "case insensitive" tj. svejedno je pišemo li ih malim ili velikim
slovima. identifikatori se pišu unutar srednjih zagrada < (manje od) i > (veće od).
<html>
je identifikator koji je obavezan nalaziti se na početku svakog HTML dokumenta i on
govori našem pregledniku da se ovdje radi o HTML dokumentu.
Završni identifikator se
dobije dodavanjem znaka "/" i označava mjesto na kojem prestaje djelovanje početnog taga,
stoga je posljednji element HTML dokumenta
</html>
, koji pregledniku govori da se ovdje
radi o kraju našeg HTML dokumenta.
Svaki HTML dokument može se strukturno podijeliti na dva dijela: 1. dio je zaglavlje (engl.
head), a 2. dio je tijelo (engl. body). Identifikatori za ta dva dijela su 1.
<head>
i
</head>
i 2.
<body>
i
</body>.
Sadržaj zaglavlja se ne prikazuje u internet pregledniku i on služi za
detaljniji opis stranice. Unutar zaglavlja stavljamo identifikatore
<title>
i
</title>
između
kojih ćemo staviti naslov naše stranice, koji se upisuje u naslovnoj traci preglednika
.
Sav
sadržaj koji se nalazi unutar <body> elementa, je stvarni sadržaj, te se kao takav prikazuje u
pregledniku. Upravo navedeni elementi (<html>, <head>, <title> i <body>) su osnovni i
obvezni elementi koje svaka stranica mora sadržavati, te zajedno cine najjednostavniji HTML
dokument.
Primjer 1:
<html>
<head>
<title>Naslov moje prve stranice</title>
</head>
<body>
Tekst moje prve stranice
</body>
</html>
Kod 3.1 – Moja prva
Stranica
Slika
3.1 – Izgled stranice iz primjera 1 u pregledniku
2
OSNOVNI ELEMENTI HTML-a
Sada ćemo reci nešto o tome kako možemo urediti tekst koji se nalazi na našoj internet
stranici. Tekst možemo oblikovati i uređivati pomoću osnovnih HTML elemenata i stilova, te
njihovih atributa. HTML stilski elementi se koriste kada se želi promijeniti grafički izgled
sadržanog teksta, a atributi nam služe kao pripomoć nekim elementima, koji im pomažu da
rade potpuno ispravno. Sastoje se od imena i vrijednosti.
Neki od elemenata su:
1.
Paragraf
(<p>)
ili odlomak koji predstavlja određenu logičku cjelinu sadržaja.
2.
Naslov
(od <h1> pa do <h6>)
kojeg koristimo kako bismo odvojili i predstavili
različite tematske cjeline dokumenta. h1 je najviša razina naslova a h6 najniža
3.
Novi red (<br>)
je element koji se koristi prilikom prelaska sadržaja u novi red unutar
odlomka.
4.
Nemogućnost prijeloma reda (<nobr>).
Ukoliko je tekst prevelik da stane u jedan
red na monitoru, na dnu prozora će se pojaviti horizontalni "klizač" i korisnik će
morati skrolati da bi ga pročitao
.
5.
Predformatirani tekst
(<pre>)
se razlikuje od običnog teksta po tome sto je svaki
znak jednake širine. Najčešće se koristi kada se na internet stranici želi prezentirati dio
računalskog koda ili se žele zadržati razmaci i novi redovi, a da se pri tome ne koristi
specijalni HTML znak ili element <br/>
6.
Font (<font>)
je identifikator koji nam omogućuje određivanje fonta teksta na našoj
stranici, a njegovi atributi veličinu i boju tog fonta.
Neki od stilova su:
1.
Bold (<b>)
nam služi kako bi podebljali tekst
2.
Italic (<i>)
nam služi kako bi ukosili tekst
3.
Underline (<u>)
nam služi kako bi podcrtali tekst
4.
Strike (<s>)
nam služi kako bi precrtali tekst
5.
Subskript (<sub>)
nam služi kako bi tekst stavili na mjesto indeksa
6.
Superskript (<sup>)
nam služi kako bi tekst stavili na mjesto eksponenta
Neki od atributa:
1.
Align
je atribut nam služi za poravnavanje elemenata naše stranice (tekst, slika, tablica
itd) u lijevo, desno ili sredinu, stoga su njegove vrijednosti:
left, right, center.
2.
Color
je atribut nam služi za određivanje boje našeg fonta. Postoje još razne varijacije
ovog atributa kao sto je npr.
bgcolor
koji nam služi za određivanje boje pozadine.
3.
Size
je atribut koji nam koristi za mijenjanje veličine slova. HTML razlikuje 7 veličina
slova koje nose vrijednosti od 1 do 7, ali isto tako veličinu slova možemo izraziti i u
pikselima
4.
Face
je atribut koji nam koristi za određivanje vrste fonta našeg teksta.
Piksel je točka koja je osnovni element slike (grafičkih datoteka), a veličina jednog piksela gotovo je oku
nevidljiva.
3
Ovaj materijal je namenjen za učenje i pripremu, ne za predaju.
Slični dokumenti