Előadást letölteni
Az előadás letöltése folymat van. Kérjük, várjon
1
FRAME-k (keretek)
2
FRAME-k A frame-ek (keretek) segítségével a képernyőt felosztva egyszerre jeleníthetünk meg több webes dokumentumot a képernyőn. Fejlec.html Menu.html Változó tartalom (menü segítségével betöltődő html oldalak – egyszerre csak 1)
3
Fejlec.html Menu.html Változó tartalom (pl. menü segítségével betöltődő html oldalak – egyszerre csak 1) FRAME FRAMESET
4
Kialakítása (általánosan)... Fejlec.html Menu.html Változó tartalom (pl. menü segítségével betöltődő html oldalak – egyszerre csak 1) FRAMESET FRAME
5
tag helye a forráskódba tag helye a forráskódba <html><head>fejrész</head><frameset> frame-ek listája és beállításaik </frameset><body></body></html>
6
tag tulajdonoságai tag tulajdonoságai A Frameset segítségével osztjuk fel a képernyőt sorokra és/vagy oszlopokra.
7
Méretmegadási módok méret megadása százalékban: méret megadása képpontokban: a terület felosztása bizonyos arányban: a 1:2 arányban osztja fel a területet 25%75%3006001*2*
8
tag paraméterei tag paraméterei NAME: név; Nevet adhatsz az adott frame-nek. Ez ahhoz kell, hogy hivatkozhass az adott frame-re, amikor például egy linket akarsz benne megnyitni) SRC: a frame URL-je; A területre betöltendő dokumentum nevét (elérését) kell megadnod itt (pl.: html fájl neve és ha kell elérési útvonala – pontosan!!!) NORESIZE: átméretezhetőség bolokkolása; Hatására az aktuális területet határoló keret nem mozdítható el SCROLLING: görgethetőség; Ezzel adhatod meg, hogy a keret tartalma görgethető legyen, vagy nem. Értékei: YES (a böngésző kirakja a gördítősávot) - alapértelmezett NO (a böngésző nem rakja ki a gördítősávot) AUTO (a böngésző csak akkor rakja ki a gördítősávot, ha szükséges)
9
tag paraméterei tag paraméterei FRAMEBORDER: határoló szegély; Azt határozza meg, hogy legyen-e látható szegély a frame körül. Értékei: 1 (van szegély), 1 (van szegély), 0 (nincs szegély) BORDER: határoló szegély vastagsága; Azt határozza meg, hogy mekkora szegély legyen a frame körül (képpontokban) FRAMESPACING: a frame-ek közti üres sáv mérete (képpontokban). MARGINWIDTH: margó szélesség; Az adott frame tartalma és a keret közti vízszintes távolság megadása képpontban MARGINHEIGHT: margó magasság; Az adott frame tartalma és a keret közti függőleges távolság definiálására szolgál
10
NOFRAMES Azon böngészők számára, amelyek nem képesek a frame-ket megjeleníteni létezik egy elem, amelyet a tag-ek között kell elhelyezni. Az ebben leírt szöveget azon böngészők jelenítik meg, amelyek nem ismerik a Frame definíciót. <Frameset><Frame><Frame>…<noframes> A Te böngésződ nem képes a keretek megjelenítésére. </noframes></Frameset>
11
1. feladat 1. Osszuk fel a progrmaablakot vízszintesen úgy, hogy a felső rész a képernyő 30%-át foglalja el, alsó része pedig a maradékot! A felső keretbe töltse be a fejlécet tartalmazó oldalt, a nagyobbik keretbe pedig a kezdőoldalt tartalmazó weboldalt! 2. A kereteket ne lehessen átméretezni, ne legyen szegélyük és 10 képpont nagyságú margó legyen a kereteknél! A fejlécet ne lehessen görgetni, viszont a kezdőoldalnál jelenjen meg a gördítősáv, ha az oldal nem fér bele a keretbe! (A kereteknek mindenképpen olyan neve legyen ami a funkciójára utal!) 3. A munkáját mentse index1.html néven! Fejléc Kezdőoldal
12
2. Feladat 1. Készítsen egy weboldalt, melyben a programablakot felossza 3 oszlopra. A 3 oszlop szélessége a következőképpen alakul: a középső fixen 800 képpont széles legyen! A bal és a jobb oldali keret egyforma nagyságot foglaljon el a programablak maradékából! 2. A bal és a jobb oldali keretbe a minta oldalak jelenjenek meg, a középsőben pedig a kezdőoldal! 3. A kereteket ne lehessen átméretezni! 4. A minta oldalakat tartalmazó kereteknek legyen egy 3 px nagyságú kerete! Biztosítsa, hogy a keretek között ne legyen távolság és ne lehessen görgetni őket! 5. A kezdőoldalt tartalmazó keretnek ne legyen szegélye, ha szükséges, lehessen görgetni és a keretbe legyen egy 5 px nagyságú margó beállítva! 6. A kereteknek mindenképpen egyértelmű neve legyen! 7. Munkáját index2.html néven mentse el! MintaKezdőoldalMinta
13
3. feladat 1. Alakítsa ki a minta szerinti programablakfelosztást keretek segítségével! 2. A kereteket ne lehessen átméretezni, ne legyen közöttük távolság és ne legyen szegélyük! 3. A fejléc és a menü keretét ne lehessen görgetni, a változó oldalakat tartalmazó kereten pedig csak akkor jelenjen meg a gördítősáv, ha szükséges! A rózsaszínnel jelölt keretbe alapértelmezés szerint a kezdőoldal jelenjen meg! A margókat ízlés szerint állítsa be! 4. A kereteknek mindenképpen olyan neve legyen, ami utal a keret funkciójára! 5. A munkáját index3.html néven mentse el! Fejlec.html Menu.html Változó tartalom (pl. menü segítségével betöltődő html oldalak – egyszerre csak 1) 250 px maradék 120 pxmaradék
14
Linkek a framekben Az alábbi feladat azt mutatja be, hogy hogyan lehet meghatározni, hogy egy adott oldal melyik frame-be töltődjön be. Azt szeretnénk, hogy a menüből kiválasztott link a kezdőoldalt tartalmazó (rózsaszín) frame-be jelenjen meg. Ehhez a linkeket a TARGET="frame neve" paraméterrel kell kiegészítenünk a linkeket tartalmazó oldal(ak)ban (feladatunkban a menu.html-ben).
15
4. feladat A menüben lévő sorokat alakítsa linkké és oldja meg, hogy az adott linkek a megfelelő oldalt töltsék be a kezdőoldal helyére! Fejlec.html Menu.html Változó tartalom Alapértelmezésbe: kezdo.html Majd a menüből: Shrek.html Szamar.html http://www.eszi.hu
16
A TARGET paraméter nem csak az általunk megadott frame-név lehet (tehát nem csak oda töltődhet be a link tartalma), hanem használhatjuk a kövthező opciókat is: TARGET="_self": az adott frame helyére töltődik az oldal.(alapértelmezett) TARGET="_parent": az adott frame fölé, a szülőframe- be töltődik az oldal. TARGET="_top": legfölülre töltődik be az oldal TARGET="_blank": egy új böngészőablakba töltődik az oldal
Hasonló előadás
