Ç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>
htm - çerceve - html - frame
<html>
<head>
<title>Çerçeveler Mavi Sayfa</title>
</head>
<body bgcolor="#0000FF">
<div align="center">
<font color="#FFFFFF">B SAYFASI </font>
</div>
</body>
</html>
htm - çerceve - html - frame
<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>
htm - çerceve - html - frame
<html>
<head>
<title>Çerçeveler Siyah Sayfa</title>
</head>
<body bgcolor="#000000">
<div align="center">
<font color="#FFFFFF">D SAYFASI </font>
</div>
</body>
</html>
htm - çerceve - html - frame

Ç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>
htm - çerceve - html - frame
<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>
htm - çerceve - html - frame
<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>
htm - çerceve - html - frame
<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>
htm - çerceve - html - frame

Ç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.

<html>
<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>

 

 



 

Firma Ekle Web Tasarım Web Tasarım Web Tasarım Web Tasarım Firma Rehberi biber hapı Zirve100 Site istatistikleri
Zirve100 Sayac
Firma Rehberi firmalar
 

=> Sen de ücretsiz bir internet sitesi kurmak ister misin? O zaman burayı tıkla! <=