Çerçeve Kullanımı / HTML FRAME
Frame; çerçeve anlamına gelir. Amacı bir web sayfasını belli parçalara bölmek ve bu parçaların içerisinde değişik, web sayfalarını görüntüleyebilmek içindir.Çerçeve yapmak için <frameset> </frameset> tagı kullanır. <frameset> tagı <head></head> ve <body></body> tagları arasında kullanılmaktadır.
FRAMESET Parametreleri;
Frame kullanırken kullandığımız frame'e isim vermek için name ( bağlantıların TARGET kısmında kullanabilmek için ) elemanını ve frame'in bulunduğu yeri göstermek için de src elemanını kullanırız.
Sayfamıza framelerin dikey veya yatay yerleşmeleri için <frameset> tagının "cols" ve "rows" elemanlarını kullanırız.
cols="*,*,*" sayfanın dikey olarak hangi oranda bölüneceğini belirlemenizi sağlar. Örneğin cols="180,450" gibi sayı yazılabilir, cols="45%,65%" ile browser penceresinin o anki ebadına göre verilen % oranlarına göre şekil alması sağlanabilir yada (*) sembolü ile açılacak çerçevenin ebadı browser'a bırakılır, cols="180,*" ifadesi ilk pencerenin 180 pixel olacağını * ise ikinci frame'in geri kalan boşluğun tümünü kaplayacağını belirtiyor. Bu şekilde açılacak çerçeve sayısını da belirtmiş olur.
rows="*,*,*" sayfanın yatay olarak hangi oranda bölüneceğini belirlememizi sağlar.
Not: Aynı <frameset> tag'ı içinde hem "cols" hem de "rows" etiketleri kullanılmaz. Anca iç içe frameler yapılırsa kullanılabilir.
frameborder=".." (yes, no) Çerçeveler arasındaki sınır çizgisinin görünüp görünmeyeceğini belirler.
border=".."
Çerçeveleri birbirinden ayıran çizgilerin kalınlığını belirler. (çerçeveler arası mesafeyi)
bordercolor ; kullandığınız çerçevenin kenarlığına renk vermek için.
Not: Çerçevenizde kenarlık istemiyorsanız, border=”0” ve frameborder=”no” vermelisiniz.
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.
Örnekler;
Ilk once dört tane htm dosyası oluşturalım. Sırasıyla a.htm, b.htm, c.htm, d.htm olarak kaydedelim.
| <html> <head> <title>Çerçeveler Kırmızı Sayfa</title> </head> <body bgcolor="#FF0000"> <div align="center"> <font color="#FFFFFF">A SAYFASI </font> </div> </body> </html> |
 |
| <html> <head> <title>Çerçeveler Mavi Sayfa</title> </head> <body bgcolor="#0000FF"> <div align="center"> <font color="#FFFFFF">B SAYFASI </font> </div> </body> </html> |
 |
| <html> <head> <title>Çerçeveler Yeşil Sayfa</title> </head> <body bgcolor="#00FF00"> <div align="center"> <font color="#FFFFFF">C SAYFASI </font> </div> </body> </html> |
 |
| <html> <head> <title>Çerçeveler Siyah Sayfa</title> </head> <body bgcolor="#000000"> <div align="center"> <font color="#FFFFFF">D SAYFASI </font> </div> </body> </html> |
 |
Çerçece Çalışmaları
| <html> <head> <title>Çerçeve Çalışma - 1</title> </head> <frameset rows="*,*" cols="*,*"> <frame name="kirmizi" src="a.htm"> <frame name="mavi" src="b.htm"> <frame name="yesil" src="c.htm"> <frame name="siyah" src="d.htm"> </frameset> <body> </body> </html> |
 |
| <html> <head> <title>Çerçeve Çalışma - 2</title> </head> <frameset cols="150,*"> <frame name=" kirmizi" src="a.htm"> <frameset rows="100,*"> <frame name=" mavi" src="b.htm"> <frame name=" yesil" src="c.htm"> </frameset> </frameset> <body> </body> </html> |
 |
| <html> <head> <title>Çerçeve Çalışma - 3</title> </head> <frameset rows="50%,50%"> <frameset cols="*,*"> <frame name=" kirmizi" src="a.htm"> <frame name=" mavi" src="b.htm"> </frameset> <frame name=" yesil" src="c.htm"> </frameset> <body> </body> </html> |
 |
| <html> <head> <title>Çerçeve Çalışma - 4</title> </head> <frameset rows="*,*,*"> <frame name=" kirmizi" src="a.htm"> <frameset cols="*,*"> <frame name=" mavi" src="b.htm"> <frame name=" yesil" src="c.htm"> </frameset> <frame name=" siyah " src="d.htm"> </frameset> <body> </body> </html> |
 |
Çerçeveler Arasında Link
name elemanı ile isimlendirdiğimiz frame'leri birbirine linkler ile bağlayabiliriz. Örnegin link verdigimiz sayfanın hangi frame de çıkmasını istiyorsak target parametresine ilgili frame’nin name’ ni yazarız.
<head>
<title>Frameler - Çerçeveler Arası Köprü Yapma</title>
</head>
<body>
<a href="ornek.htm" target="kirmizi">Ornek Sayfa</a>
</body>
</html>
Iframe
Iframe, Html sayfa içerisinde istediginiz yere başka bir html sayfayı yerleştirmek için kullanılır.
Söz Dizimi:
<IFRAME name="frame_adi" src="frame_adresi.html" width="500" height="100" scrolling="no" frameborder="0" marginwidth="0" marginheight="0"></IFRAME>
name tagı ile Frame adını , width, height değerleriyle Sayfa içersinde Framenin boyutları ayarlıyoruz, scrolling ile yanda scrollbar oluşup oluşmamasını, frameborder ile kenarlık kalınlıklarını belirtilir.
Sayfamızdan Iframe alanına bir link vermek için <a href="link.html" target="frame_adi">Link Adı</a> Şeklinde target kısmına frame adını yazmamız gerekir.
Iframe'ler arama motorları tarafından indekslenmezler bu yüzden <noframe>içeriğimiz buraya</noframe> taglarını kullanarak frame hakkında arama motoru botuna yardımcı olabiliriz.
Örnek:
<iframe name="cerceve" id=datamain marginwidth=0 marginheight=0 src="pages/kumanda.htm" frameborder=0 width=350 scrolling="no" height=350>
</iframe>
