Merhaba değerli Kodlama Vakti okuyucuları , geçen dersimizde ID Kullanımı adlı yazımızda HTML’de ID kullanımını öğrenmiştik. Önceki dersimizi incelemediyseniz HTML Dersleri 12 – ID Kullanımı linkine tıklayarak ulaşabilirsiniz. Bu dersimizde HTML Iframe konusuna gözatıp, HTML’de iframe kullanımını inceleyip , web sitelerimizin içine başka web sitelerini gömmeyi öğreneyeceğiz.
Iframe Nedir ? Iframe etiketi HTML sayfamızda, herhangi bir web sitesini gömmemize yaramaktadır.Eski bir teknik olsa da, yinede bazı yerlerde kullanım ihtiyacı doğmaktadır. < iframe > etiketi ile bir Iframe tanımlanır. Aşağıda Iframe kullanımı örneği görmektesiniz ;
ÖRNEK KULLANIM
<iframe src="URL"></iframe>
Iframe etiketi içerisinde src parametresine görüntülemek istediğimiz URL (Web Adresi) yazmamız yeterlidir.
Iframe - Yükseklik ve Genişlik Ayarları
Iframe boyutunu belirlemek için height ve width parametreleri kullanılır.
Yükseklik ve Genişlik değerleri varsayılan olarak piksel cinsinden belirtilir, ancak bunlar yüzde cinsinden de ("% 80" gibi) olabilir.
<iframe src="https://www.google.com" height="200" width="300"></iframe>
Diğer bir seçenek ise Iframe yüksekliği ve genişliği ayarlamak için style parametresi ile CSS kullanabiliriz.
<iframe src="https://www.google.com" style="height:200px;width:300px;"></iframe>
Iframe - Border(Çerçeve) Kaldırma
Varsayılan olarak Iframe çerçeveli (border) olarak gelir. Bu çerçeve kalınlığını kaldırmak veya düzenlemek için CSS kullanmak gerekir.
Border(Çerçeve) Kaldırma
<iframe src="https://www.google.com" style="border:none;"></iframe>
Çerçeve kalınlığını kaldırmak için style parametresi içerisine border:none; kodunu yazmamız yeterlidir.
Tebrikler! Bu derste HTML’de Iframe Kullanımını, Ifame kavramını , HTML'de Iframe Genişlik ve Yükseklik ayarlamalarını, HTML'de Iframe Çerçeve (Border) kaldırma kullanımını öğrendik.Kodlama Vakti ile kodlama hiç bu kadar kolay olmamıştı.
HTML Derslerinin onüçüncü kısmı olan dersimizde , HTML’de Iframe Kullanımı konusunu öğrendik. Ders sonunda ki testimize katılarak öğrendiklerinizi pekiştirebilirsiniz. Derslerimiz hoşunuza gittiyse eğer paylaş butonlarından sevdiklerinizle paylaşabilirsiniz !