| PROIECTARE SITE WEB > DOCUMENTATIE - HTML - Ferestre cadru
in HTML |
Proiectare Site si Web Design - Standardul HTML
Cadre in HTML
Ferestrele sau (cadrele) ne permit sa definim in fereastra
browserului sub-ferestre in care sa putem incadra documente noi HTML.
Sub-ferestrele sunt definite intr-un fisier HTML special, in care
blocul <body>...</body> este inlocuit de
blocul <frameset>...</frameset>. In interiorul
acestui bloc, fiecare cadru este introdus prin eticheta <frame>.
Un atribut obligatoriu al etichetei <frame> este "src",
ce primeste ca valoare adresa URL a documentului HTML care va fi incarcat
in acel frame. Definirea cadrelor se face prin impartirea ferestrei
ecran (si a subferestrelor) in linii si coloane:
1. impartirea unei ferestre intr-un
numar de subferestre de tip coloana se face cu ajutorul atributului
"cols" al etichetei <frameset> ce descrie
acea fereastra;
2. impartirea unei ferestre intr-un numar de subferestre
de tip linie se face cu ajutorul atributului "rows"
al etichetei <frameset> ce descrie acea fereastra;
3. valoare atributelor "cols" si "rows"
este o lista de elmente separate prin virgula, care descriu modul
in care se face impartirea. Elementele listei pot fi:
3.1. un numar intreg de pixeli;
3.2. procente din dimensiunea ferestrei (numar intre
1 si 99 terminat cu %);
3.3. n* care inseamna n parti din spatiul ramas;
Exemplu
1: "cols=200,*,50%,*"
inseamna o impartire in 4 subferestre, dintre care prima are 200 pixeli
latime, a treia ocupa jumatate din spatiul total disponibil iar a
doua si a patra ocupa in mod egal restul de spatiu ramas disponibil.
Exemplu
2: "cols=200,1*,50%,2*"
inseamna o impartire in 4 subferestre, dintre care prima are 200 pixeli
latime, a treia ocupa jumatate din spatiul total disponibil iar a
doua si a patra ocupa in mod egal restul de spatiu ramas disponibil,
care se imparte in trei parti egale, a doua fereastra ocupand o parte
iar a patra ocupand 2 parti.
Observatii:
- daca mai multe elemente din lista sunt configurate
cu *, atunci spatiul disponibil ramas pentru ele se va imparti in
mod egal.
- o subfereastra poate fi un singur cadru (folosind <frame>)
- in care se va incarca un document HTML - sau poate fi impartita
la randul ei la alte subfereste constituind cadre noi (folosind
<frameset>).
Exemplu:
<html>
<head><title>ferex_1</title></head>
<frameset cols="*,*">
<frame src="p1.html">
<frame src="p2.html">
</frameset>
</html>
In exemplul urmator este creata o pagina Web cu trei
cadre orizontale. Pentru al doilea cadru valoarea atributului "src"
este adresa URL a unei imagini, ca
in exemplu:
<html>
<head><title>ferex_2</title></head>
<frameset rows="100,*,10%">
<frame src="p1.html">
<frame src="x.jpg">
<frame src="p3.html">
</frameset>
</html>
In exemplul urmator este creata o matrice de 4 cadre
(2 x 2). Pentru a realiza acest lucru, se folosesc simultan cele doua
atribute Cols si Rows, precum in
exemplul urmator:
<html>
<head><title>ferex_3</title></head>
<frameset rows="*,*" cols="*,*">
<frame src="p1.html">
<frame src="p2.html">
<frame src="p3.html">
<frame src="p4.html">
</frameset>
</html>
In exemplul urmator este creata o pagina Web cu trei
cadre mixte. Pentru a o crea se procedeaza din aproape in aproape.
Mai intai, pagina este impartita in doua subferestre de tip coloana,
dupa care a doua subfereastra este impartita in doua subferestre de
tip linie, ca in exemplul
de mai jos:
<html>
<head><title>ferex_4</title></head>
<frameset cols="20%,*">
<frame src="p1.html">
<frameset rows="*,*">
<frame src="p2.html">
<frame src="p3.html">
</frameset>
</frameset>
</html>
Culori pentru chenarele cadrelor si dimensionarea
chenarului unui cadru
Pentru a stabili culoarea chenarului unui cadru se utilizeaza atributul
"bordercolor". Acest atribut primeste ca valoare
un nume de culoare sau o culoare definita in conformitate cu modelul
de culoare RGB. Atributul bordercolor poate fi atasat atat etichetei
<frameset> pentru a stabili culoarea tuturor chenarelor cadrelor
incluse, cat si etichetei <frame> pentru a stabili culoarea
chenarului pentru un cadru individual.
Atributul "border" al etichetei <frameset>
permite configurarea latimii chenarelor tuturor cadrelor la un numar
dorit de pixeli. Valoarea prestabilita a atributului "border"
este de 5 pixeli. O valoare de 0 pixeli va defini un cadru fara chenar.
Exemplu:
<html>
<head><title>ferex_5</title></head>
<frameset cols="20%,*" bordercolor="green"
border="15">
<frame src="p1.html">
<frameset rows="*,*">
<frame src="p2.html" bordercolor="blue">
<frame src="p3.html">
</frameset>
</html>
In mod prestabilit, chenarul afisat al unui cadru
are aspect tridimensional. Afisarea chenarului unui cadru poate fi
dezactivata daca se utilizeaza atributul "frameborder"
cu valoare "no". Acest atribut poate fi atasat atat etichetei
<frameset> (dezactivarea fiind valabila pentru toate cadrele
incluse) cat si etichetei <frame> (dezactivarea fiind valabila
numai pentru un singur cadru).
Exemplu:
<html>
<head><title>ferex_5_1</title></head>
<frameset cols="20%,*" border="0">
<frame src="p1.html">
<frameset rows="*,*">
<frame src="p2.html">
<frame src="p3.html">
</frameset>
</html>
<html>
<head><title>ferex_5_2</title></head>
<frameset cols="20%,*" frameborder="no">
<frame src="p1.html">
<frameset rows="*,*">
<frame src="p2.html">
<frame src="p3.html">
</frameset>
</html>
Bare de defilare
Atributul "scrolling" al etichetei <frame>
este utilizat pentru a adauga unui cadru o bara de derulare care permite
navigarea in interiorul documentului afisat in interiorul cadrului.
Valorile posibile sunt:
1. "yes" - barele de derulare
sunt adaugate intotdeauna;
2. "no" - barele de derulare nu sunt utilizabile;
3. "auto" - barele de derulare sunt vizibile
atunci cand este necesar
Exemplu:
<html>
<head><title>ferex_6</title></head>
<frameset cols="*,*,*">
<frame src="p.html" scrolling="yes" noresize>
<frame src="p.html" scrolling="no" noresize>
<frame src="p.html" scrolling="auto" noresize>
</frameset>
</html>
Atributul "noresize" al etichetei
<frame> (fara nici o valoare suplimentara) daca este prezent,
inhiba utilizatorului posibilitatea de a redimensiona cadrul cu ajutorul
mouse-ului.
Pozitionarea documentului intr-un cadru
Atributele "marginheight" si "marginwidth"
ale etichetei <frame> permit stabilirea distantei in pixeli
dintre continutul unui cadru si marginile verticale, respectiv orizontale
ale cadrului.
Valori posibile:
- numar de pixeli;
- procent din latimea, respectiv din inaltimea cadrului;
Exemplu:
<html>
<head><title>ferex_7</title></head>
<frameset cols="*,*,*">
<frame src="p.html">
<frame src="p.html" marginheight=20>
<frame src="p.html" marginwidth=20>
</frameset>
</html>
Exista browsere care nu suporta cadre. Pentru aceasta
se utilizeaza in interiorul blocului <frameset> eticheta <noframes>.
Daca programul de navigare stie sa interpreteze cadre, va ignora ce
se gaseste in aceasta portiune, iar daca nu, materialul cuprins in
zona <noframes>...</noframes> va fi singurul care va fi
inteles si afisat. De precizat este faptul ca intre <noframes>
... </noframes> se pot introduce orice alte tag-uri HTML (inclusiv
imagini, hiperlink-uri, tabele).
|
Creare
si actualizare site