Frame Çerçeveler Web sayfasını birden fazla html sayfa ile oluşturmaya imkan tanır. html örnekler\örnek17.html. örnek17.html

Ebat: px

Şu sayfadan göstermeyi başlat:

Download "Frame Çerçeveler Web sayfasını birden fazla html sayfa ile oluşturmaya imkan tanır. html örnekler\örnek17.html. örnek17.html"

Özgür Yalman
8 yıl önce
İzleme sayısı:

1 HTML Ders 7

2 Frame Çerçeveler Web sayfasını birden fazla html sayfa ile oluşturmaya imkan tanır. html örnekler\örnek17.html örnek17.html htm1.html htm1.html

$html örnekler\örnek17.html örnek17.$

3 <frameset>...</frameset> Çerçeve oluşturmada kullandığımız etiket frameset, cols ifadesi açılacak çerçevelerin yan yana sütunlar şeklinde olacağını belirtiyor, buraya rows yazarsak çerçeveler alt alta satırlar görünümünde açılacaktır. <frameset rows="*,*">

4 <frameset>...</frameset> cols="*,*" ifadesi ile açılacak çerçevelerin pixel cinsinden ebatlarını belirliyoruz, cols="140,500" gibi sayı yazılabilir, cols="25%,75%" ile browser penceresinin o anki ebadına göre verilen % oranlarına göre şekil alması sağlanabilir * sembolü ile açılacak çerçevenin ebadı browser'a bırakılır, cols="140,*" ifadesi ilk pencerenin 140 pixel olacağını ikincinin ise ebadının browser'a bırakıldığını gösteriyor.

cols="140,500" gibi sayı yazılabilir, cols="25%,75%" ile browser penceresinin o anki ebadına göre verilen %

5 frame name="..." src="..." frame name="..." src="..." etiketi çerçevelere, bağlantıların TARGET kısmında kullanabilmek amacıyla isim (name) vermeyi sağlıyor (bu konuya aşağıda değineceğiz). src pencerede görüntülenecek html dosyasının yerini gösteriyor. resimler bahsinde belirttiğimiz yer (kaynak) gösterme kuralları burada da geçerli. Açılacak çerçeve sayısı kadar frame name="..." src="... etiketi kullanıyoruz. Eski sürüm browserların çerçeve etiketini tanımadıklarından bahsetmiştik, işte noframes kısmı bu browserlara hitap ediyor. <body> kısmını bu eski browserlar görüntüleyebiliyor.

src pencerede görüntülenecek html dosyasının yerini gösteriyor. resimler bahsinde belirttiğimiz yer (kaynak) gösterme kuralları burada da geçerli.

6 FRAMESET parametreleri frameborder="..." (yes, no) Çerçeveler arasındaki sınır çizgisinin görünüp görünmeyeceğini belirler. border="..." (sayı) Sınır çizgisinin kalınlığını (veya çerçeveler arası mesafeyi) belirler

7 Daha karmaşık çerçeveler a

8 Daha karmaşık çerçeveler

9 Daha karmaşık çerçeveler

10 FRAME parametreleri marginwidth="..." marginheight="..." (sayı) Sayfanın solundaki (marginleft) ve üstündeki (margintop) kenar boşluklarını belirler. scrolling=".." (yes, no, auto) Kaydırma çubuklarının durumunu belirler. noresize Pencere boyutlarının sabit olmasını sağlar.

kenar boşluklarını belirler. scrolling=".

11 Resim Haritalarına Giriş & Dikdörtgensel Alanlar Resim haritaları, resimleri tıklanabilir bölgelere ayırabilmemize olanak sağlıyor. Klasik örnekler olarak Türkiye haritasının veya insan anatomisinin resimlerini düşünebilirsiniz. Ankara'ya veya karaciğere tıklamak sizi ilgili sayfalara götürecektir. Resim üzerinde bir harita tanımlarken dikdörtgensel, dairesel ve çokgensel alanlar tanımlayabiliriz.

Klasik örnekler olarak Türkiye haritasının veya insan anatomisinin resimlerini düşünebilirsiniz.

12 Resim Haritaları <MAP NAME="harita1"> <AREA SHAPE=RECT COORDS="7,11,89,37" HREF="servis.html" ALT="Servis"> </MAP> İlk yaptığımız <MAP> işareti ile bir harita tanımlamak. NAME="harita_ismi" parametresi ile haritamıza mutlaka bir isim vermelidir. Çünkü aynı sayfada birden çok harita kullanabiliriz. Tanımladığımız haritayı hangi resimde kullanacaksak o resmin <IMG SRC=""> işaretinin arkasına USEMAP="#harita_ismi" parametresini eklemeliyiz. <IMG SRC="menu_ust.gif" WIDTH=287 HEIGHT=49 USEMAP="#harita1" BORDER=0>

NAME="harita_ismi" parametresi ile haritamıza mutlaka bir isim vermelidir. Çünkü aynı sayfada birden çok harita kullanabiliriz.

13 Resim Haritaları ve Alanları Harita tanımlarken <MAP> ve </MAP> işaretleri arasında kalan bölüme, kaç tıklanabilir alana ihtiyaç varsa o kadar <AREA> takısı eklememiz gerekiyor. SHAPE parametresi tanımlanan alanın tipini belirlemek için kullanılıyor ki şimdilik sadece dikdörtgensel (RECT, CIRCLE, POLY) alanlar tanımlıyoruz. COORDS parametresi de tanımladığımız alanın koordinatlarını belirlemek için kullanılıyor. RECT için sırasıyla sol üst köşenin x, y koordinatları ile yine sırasıyla sağ alt köşenin x, y koordinatları verilir COORDS ="7,11,89,37". html örnekler\örnek18.html CIRCLE için merkezinin koordinatları x:140, y:40 iken yarıçapı da 40 olan dairesel düğme için COORDS ="140,40,40. html örnekler\örnek18a.html

$RECT için sırasıyla sol üst köşenin x, y koordinatları ile yine sırasıyla sağ alt köşenin x, y koordinatları verilir COORDS ="7,11,89,37". html örnekler\örnek18.$

14 Resim Haritaları ve Alanları POLY için ilgili çokgenin köşe noktalarının koordinatları sırasıyla yazılır. Bu liste çoğu zaman oldukça uzun olmaktadır. html örnekler\örnek18b.html

Benzer belgeler

İNTERNET PROGRAMCILIĞI I

İNTERNET PROGRAMCILIĞI I BÖLÜM 11 11- ÇERÇEVELER (FRAME) Çerçeve tekniği, bir web sayfasını istenilen miktarda parçaya bölüp, bu sayfa üzerinde birkaç sayfa birden görüntülenmesine olanak verir. Bu tekniğin en çok kullanılan varyasyonu,