21 Temmuz 2014 Pazartesi

HTML'de Ç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, sayfanın sol veya üst kısmından küçük bir alan bölmek (yani sayfayı ikiye bölmek), bu küçük alana menü bilgilerini, diğer büyük alana ise sayfanın asıl içeriğini yerleştirebilmemize olanak sağlar. Fakat  birçok tasarımcı çerçevelere pek sıcak bakmaz; genelde üst üste tablolar kullanmayı tercih eder. Yinede aklınızda bu teknik olsun, ilerde işinize yarayacaktır. Şimdi bu konuda bilmemiz gereken baslıca kodları inceleyelim.


<frameset> . . . </frameset>   Çerçeve (frame) yaratır. İç içe çerçeve olabilir.

<frameset rows="value,value">  Bir (ana) çerçeve içinde kaç tane yatay çerçeve oluşacağını belirler. Çerçevenin yatay uzunluğu piksel, ya da ana çerçevenin genişliğinin yüzde oranıyla belirlenebilir. İlk ana çerçeve bütün ekrandır.


<frameset cols="value,value">     Bir (ana) çerçeve içinde kaç tane düşey çerçeve (kolon) oluşacağını belirler. Çerçevenin yatay uzunluğu piksel, ya da ana çerçevenin genişliğinin yüzde oranıyla belirlenebilir. İlk ana çerçeve bütün ekrandır.


<frame>     Bir çerçeve içinde bir tek çerçeve yaratır.


<noframes> . . . </noframes>    Frame'i desteklemeyen tarayıcılar için alternatif açıklama yaratır.


Yukarıdaki kodları inceledikten sonra, bir örnek yapalım.


Yukarıda örneği çalıştırdığımız zaman ekrana aşağıdaki gibi bir web sayfası gelecektir.










Eğer browserimiz sayfayı desteklemeseydı <noframes> ile </noframes>  arasında yazan uyarı mesajı ekrana cıkacaktır.
Framelerle ilgili diğer kodlarımızıda inceleyelim:
<frame src="URL">      Çerçevede görüntülenecek HTML dökümanını belirler.
<frame name="name">   Çerçeveye ad verir. Böylece, başka çerçevelerin burayı hedef seçmeleri olanağı doğar.
<frame marginwidth=#>    Çerçevenin sol ve sağ kenar boşluklarını belirler. 1 den küçük olamaz.
<frame marginheight=#>    Çerçevenin alt ve üst kenar boşluklarını belirler. 1 den küçük olamaz.
<frame scrolling=VALUE>  Çerçevede kayma çubuklarının olup olmamasını belirler. "yes", "no" , "auto" değerlerini alabilir. Açık (default) değeri "auto" dur. "no" değeri kayma çubuğu koymaz.
<frame noresize>      Kullanıcının çerçeve boyutunu ayarlamasını önler.

IFRAME 

Bunun yukarıda anlatılandan farklı yanı normal bir HTML belgesinde farklı bir sayfa ya da site için pencere açmanıza yaramaktadır. Pencere içerisinde boyutu belirttiğiniz boyutlarda olmak üzere belirttiğiniz site görünecektir: Şimdi bu dediğimizi bir örnek yaparak inceleyelim:

















       
Yukarıda örneği çalıştırdığımız zaman ekrana aşağıdaki gibi bir web sayfası gelecektir.
Son olarak Frame ile iFrame arasındaki fark nedir sorusuna geldiğimiz zaman; iki koduda denediğinizde farkı göreceksiniz ama yinede kısaca anlatalımFrame sayfamızı çerçevelere böler. Boyutlandırma yapılır fakat sayfanın tamının bir bölümü olarak ayarlanmak zorundadır. iFrame ise boyutlarını scrollbarı sayesinde belirlediğimiz esnek bir pencere oluşturur.

Hiç yorum yok: