HTML Frames

3. FRAME tag

U narednim primjerima korisit će se ovi fajlovi (body dokumenti) za učitavanje u okvire: doc_a.html , doc_b.html , doc_c.html i doc_d.html .

Tag <frame> koristi se u kombinaciji sa frameset tagom. Ovaj tag nije container odnosno ne treba pisati zatvarajući tag </frame> . Broj ovih tagova ovisi o tome koliko smo okvira definirali pomoću COLS i ROWS atributa. Dakle, ako smo unutar frameset taga definirali 3 okvira onda ćemo morati napisati i toliko frame tagova. Što se dešava ako npr. u frameset tagu definiramo 3 okvira, a napišemo samo jedan frame tag pogledajte ovdje , a code ovog primjera ovdje .
Zato se može reći da svaki frame tag određuje svojstva pojedinom okviru. A ta svojstva jesu upravo slijedeći atributi :

1. src="URL"
Ovo je atribut koji omogućava učitavanje nekog html ili pak frameset dokumenta u okvir. Dovoljno je samo unijeti put do takvog fajla (bilo apsolutni bilo relativni) i stvar je riješena .
1. primjer : src="./doc_a.html" i src="./doc_b.html"
Fajl doc_a.html je stranica A i biti će učitana u lijevi okvir, a fajl doc_b.html je stranica B i učitat će se u desni okvir.
Vidi primjer !!!     Vidi mu code !!!

2. name="string"
Atribut name dodjeljuje naziv frame tagu. Naziv mora početi slovom ili brojem. Od posebne je važnosti za povezivanje "linkanje" okvira te će biti objašnjen nešto kasnije.

3. noresize
Atribut kojemu ne moramo pridružiti nikakvu vrijednost. Ako ga upotrijebimo on jednostavno sprečava korisnika da pomoću cursora miša promijeni veličinu prozora.
1. primjer : noresize
Kad pogledate primjer pokušajte promijeniti veličinu okvira tako da mišem povučete ivicu u stranu. NE MOŽETE !!! Pa naravno da ne .
Vidi primjer !!!     Vidi mu code !!!

4. scrolling="yes | no | auto"
Tag scrolling određuje da li će se s donje i desne strane okvira pojavljivati scrollbar. Ako stavimo yes onda će stojati stalno, ako stavimo no nikad ga vidjeti nećemo. A auto ? U tom slučaju browser sam određuje kada će se pojaviti. Obično se pojavi kad text, slika ili nešto drugo ima veće dimenzije od okvira. Veoma je nezgodno ako stavite "no" jer se može desiti da korisnik pri drugačijoj rezoluciji monitora od vaše možda neće moći vidjeti cio sadržaj. Takav slučaj možete vidjeti u narednom primjeru.
1. primjer : scrolling="yes" i scrolling="no"
U slijedećem primjeru scrolling="yes" je primjenjen na lijevi okvir, a scrolling="no" na desni. Obratite pažnju kako je sadržaj u desnom okviru odrezan te se može vidjeti samo ako ivicu pomaknemo u lijevu stranu.
Vidi primjer !!!     Vidi mu code !!!

5. marginwidth="px" i marginheight="px"
Ova dva taga kontroliraju unutrašnju marginu dokumenta. Odnosno definiraju koliko će pixela sadržaj biti udaljen od ivice okvira. Marginwidth određuje udaljenost sadržaja od lijeve i desne ivice, a marginheight od gornje i donje ivice. Vrijednost ne smije biti manja od 1, dakle 0 ne dolazi u obzir. Predefinirana vrijednost je 13 ili 14px što ovisi o browseru..
1. primjer : marginwidth=1 marginheight=1
U slijedećem primjeru će slika biti smještena točno u gornji lijevi kut okvira. To je zato što smo marginu definirali sa 1px.
Vidi primjer !!!     Vidi mu code !!!

6. frameborder="yes | 1 | no | 0"
Isto kao kod frameset taga ovaj atribut određuje da li će ivica (rub) biti prikazana ili ne. Jedina je razlika u tome da oba okvira (frame taga) koji okružuju ivicu moraju imati napisan taj atribut. U protivnom stvar neće raditi !!!
1. primjer : frameborder="no"
Naredni primjer pokazuje kako je prozor podijeljen u tri okvira. Između prva dva je ivica nevidljiva, a između drugog i trećeg je vidljiva.
Vidi primjer !!!     Vidi mu code !!!

7. bordercolor="color"
Bordercolor atribut određuje boju ivice. Kod IE browsera je ovaj atribut bugovit pa sve neće raditi onako kako budete očekivali. Kod Mozille neće biti nikakvih problema.
1. primjer : bordercolor="red"
Uočite da iako je u frameset tagu napisano bordercolor="green" da će obje ivice biti crvene. To je bug u IE5.5. Međutim, kod Mozille će ivica između prvog i drugog okvira biti crvena, a druga ivica će biti zelena što je po mom mišljenju pravilno ponašanje. Dakle, rezultat je 1:0 za Mozillu :) .
Vidi primjer !!!     Vidi mu code !!!

Sada kada ste upoznali ova dva taga i sve njihove atribute možete prijeći na rasturanje okvira. Pogledajte narednu lekciju u kojoj je dat jedan malo složeniji primjer !!!