HTML-osnove

BOJE

U prethodnom primjeru dobili smo tekst ispisan crnim slovima na bijeloj pozadini. Međutim, kao što vrlo dobro znamo, na Web stranicama se pozadina i tekst mogu pojaviti u čitavom spektru boja. Da bi to postigli potrebno je  dodati još neka objašnjenja u okviru našeg <body> taga. Dodatna objašnjenja  HTML taga nazivaju se atributi. Atributi se unose u početni tag i služe da detaljnije opišu dati tag.

Na primjer, ako želimo  promijeniti boju pozadine u žutu tada ćemo unutar <body> taga dodati:

<body bgcolor="#ffff00">

ili:

<body bgcolor="yellow">

što daje isti krajnji efekat.

Dakle, vidimo da se boja pozadine određuje bgcolor atributom koji je dio <body> taga. Poslije svakog atributa se stavlja znak jednakosti koji služi za dodijelu vrijednosti datom atributu, a vrijednost atributa se obvezno stavlja između znakova navoda.
Što se tiče označavanja boja, iz gornjeg primjera vidimo da se boje mogu definirati na dva načina: ili preko naziva boje (npr."yellow"), ili preko heksadecimalne RGB vrijednosti ispred koje obvezno treba staviti simbol # (npr. #ffff00). Možda će browser prikazati željenu boju i bez ovog simbola ali ga za svaki slučaj stavimo jer ga neki browseri striktno zahtijevaju.

Kod kreiranja Web stranica možemo se koristiti tablicom boja sa njihovim nazivima i heksadecimalnim kodom. Boje su poredane po abecednom redu, a kad nam se neka boja dopadne kopirajmo (copy) njen kod (rrggbb vrijednost) na našu Web stranicu.

Boja teksta se određuje text atributom. Ako želimo da naša stranica ima zelena slova na žutoj pozadini stavit ćemo:

<body bgcolor="#ffff00" text="#008000">

Ono što HTML čini izuzetnim, i što je uvjetovalo njegovu veliku popularnost jesu tzv. linkovi. Linkovi u HTML dokumentu su one riječi koje se pojavljuju u drugoj boji i podvučene su radi lakšeg uočavanja, a omogućavaju vam da se jednim klikom miša nađemo na nekoj sasvim drugoj stranici koja se može nalaziti i na drugom kraju svijeta. 
Kad dovedemo pokazivač miša iznad linka dogodit će se dvije stvari: pokazivač miša će se pretvoriti u ruku sa ispruženim prstom (što simbolično govori da tu možete kliknuti), a sam link će promijeniti boju (obično u crvenu, ako drugačije ne definiramo).
Osim toga boja linkova koje smo već posjetili biće drugačija od ostalih linkova, kako bi imali orijentaciju što smo već vidjeli, a što nam još ostaje da posjetimo.

Boje linkova se mogu definirati pomoću tri atributa: link, vlink i alink. Na primjer, ako želimo da na našim 
Web stranicama linkovi budu plavi, posjećeni linkovi ljubičasti, a aktivni linkovi crveni stavimo:

<body link="#0000ff" vlink="#ee82ee" alink="#ff0000">

Sve ove atribute možemo i izostaviti ako želimo da browser koristi vrijednosti koje su definirane po default-u. U Internet Exploreru pozadina je po default-u bijela, tekst crn, linkovi plavi, posjećeni linkovi maslinasto-zeleni, a aktivni linkovi crveni. Ako nam se sviđa ova shema boja, nemojmo ništa mijenjati.

Međutim, šta ako nismo zadovoljni jednobojnom pozadinom, već želimo  imati bogato ukrašenu pozadinu kakve često srećemo na Web stranicama. U tom slučaju moramo staviti kao pozadinu neku sliku u JPEG ili GIF formatu. Ovo su obično male sličice koje se brzo učitavaju i "tajluju" (redaju poput pločica , eng. tile). Ove pozadine (eng. background) možemo pronaći u raznim kolekcijama WEB grafike širom Interneta, a možemo i "spremiti" pozadinu sa Web stranica koja nam se dopadne. To se postiže na slijedeći način:
kada na nekoj stranici ugledamo pozadinu koja nam se dopada i poželite je sačuvati na svom hard disku,  kliknemo desnom tipkom miša na bilo koji dio pozadine te stranice i iz priručnog menija koji se pojavi odaberemo opciju Save Background As. Odaberemo folder u kojem ćemo čuvati odabrane pozadine i dajmo toj pozadini odgovarajuće ime (npr. pozadina1.jpg ili pozadina2.gif)

Kada ste odabrali pozadinu koju želimo staviti na našu Web stranicu, prvi korak je da tu datoteku prekopiramo u folder u kom se nalazi i naša prezentacija. Slika i HTML dokument ne moraju  obvezno biti u istom folderu ali tako je jednostavnije.) Sad još samo preostaje da u našem HTML dokumentu tj. njegovom body tagu upišemo odgovarajući atribut. Atribut se u ovom slučaju zove background i bilo bi poželjno da ga ne pomiješate sa atributom bgcolor koji definira samo boju pozadine.
Na primjjer, ako želimo da kao pozadinu stavite sliku "pozadina1.jpg" tada će body tag izgledati ovako:

<body background="pozadina1.jpg" bgcolor="#000000">

Kao što vidimo ubacili smo i background i bgcolor tag, i to ne slučajno. O čemu se radi? Pa mnogi ljudi sa sporijim modemima prilikom surfovanja Internetom isključuju u svojim browserima automatsko učitavanje grafike.
To znaci da se neće učitati ni pozadina koju ste vi dodijelili toj stranici. Problem nastaje u slučajevima kada smo tekstu dodijelili neku svijetlu (ili  bijelu boju), a browser ne učita pozadinu, već i pozadina ostane bijela. 
Blijeda (ili bijela) slova na bijeloj pozadini se jednostavno neće vidjeti. Zbog toga uvijek dodijelimo i neku bojuj pozadini tako da u gore opisanoj situaciji slova i dalje budu čitljiva.