HTML Çerçeve Kodu (Frame) [Ders 8]


HTML Çerçeve Kodları
HTML Çerçeve Kodları

Web tasarımcılar çerçeveyi pek sevmez. Bunun sebebi, çerçeve özelliği HTML belgesini farklı sayfadan çektiği için sayfaya hoş bir görüntü vermez. Fakat bazen bize kolaylık sağlar. Bunu bilerek çerçeve kodu (frame) dersimize başlayalım.

HTML’de birden fazla belgeyi, tek bir sayfada toplayabiliriz. Sayfayı pencerelere bölmeyi <frameset> komutuyla sağlıyoruz. <frame> etiketi ileyse her bir çerçevenin özelliklerini ve çerçevede gösterilecek sayfayı belirtiyoruz… Şimdi örneğimizi yapalım ve inceleyelim:

cerceve1.html dosyası:
<html>
<head>
<title>Sol Çerçeve</title>
</head>
<body bgcolor="red">
<font size=7>Sol Çerçeve</font>
</body>
</html>

cerceve2.html dosyası:
<html>
<head>
<title>Sağ Çerçeve</title>
</head>
<body bgcolor="blue">
<font size=7>Sağ Çerçeve</font>
</body>
</html>

Şimdi de bu iki çerçeveyi koyacağımız Ana Çerçeveyi yapalım (frame.html):
<html>
<head>
<title>Ana Çerçeve</title>
</head>
<frameset cols="30%, 70%">     //yatay pencere için rows özelliği kullanın.
<frame name="solcerceve" src="cerceve1.html">
<frame name="sagcerceve" src="cerceve2.html">
<body><noframes>Üzgünüz, lütfen farklı bir tarayıcı ile tekrar deneyin</noframes></body>
</frameset>
</html>

Dikkat etmemiz gereken nokta; <body></body> etiketleri arasına yazılmamasıdır. Bu kısıma frame tekniği desteklemeyen tarayıcılar için <noframes></noframes> etiketleri arasına not düşülebilir.

IFRAME Etiketi Kullanmak
Eğer sayfanıza dışarıdan bir belgeyi çağırmak istiyorsanız, <iframe> etiketini kullanarak istediğiniz boyutlarda getirebilirsiniz. Örnek ve görünümü;

<iframe src="https://www.dergice.com" frameborder="1" width="350" height="350" scrolling="yes"></iframe>

frameborder="0"  //Çerçevede kenarlık kullanılmayacağını belirtir.
width="350"      //Çerçevenin 350 piksel genişlikte olacağını belirtir.
height="350"     //Çerçevenin 350 piksel yükseklikte olacağını belirtir.
scrolling="no"   //Kaydırma çubuğunu göstermez.

Bu içeriği nasıl buldunuz?

Beğen Beğen
0
Beğen
Mutlu Mutlu
0
Mutlu
Eğlenceli Eğlenceli
0
Eğlenceli
Üzgün Üzgün
0
Üzgün
Olamaz Olamaz
0
Olamaz
Kızgın Kızgın
0
Kızgın
Komik Komik
0
Komik
İlginç İlginç
0
İlginç
dergiCE

Dijital yayıncılık alanında Türkiye, yükselen bir grafik çizmektedir. Bu amaç ile profesyonel işlere imza atmak üzere yola çıktık. 5. yılımızda araştırmayı seven herkese kapımızı açtık. Sizlerde makalelerinizi dergiCE'de paylaşarak, dijital dünyada yerinizi alabilirsiniz.

Yorumlar 0

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir

İçerik Türünü Seçin
Kişilik Testi
Kişilik Hakkında Testler
Test
Cevaplamalı Testler
Anket
Oylamalı Seçenekler
Yazı
Biçimlendirilmiş Metinler
Puanlamalı Liste
Puanlamalı Liste
Video
Youtube, Vimeo, Vine vs
Ses/Müzik
Soundcloud, Mixcloud
Resim
GIF veya Resim