Merhabalar, bu yazımda sitemizin içinde farklı siteleri gösterebilmek için kullandığımız Iframe etiketine bakıyor olacağız.

Hemen başlayalım.

En basit IFrame aşağıdaki gibi yaratılır.

<iframe src="https://industryolog.com"></iframe>

src attribute’u sitenin linkini alır.

Görüntüsü aşağıdaki gibi olacaktır.

IFrame alanına bir genişlik ve yükseklik vererek boyutlandırabiliriz. IFrame bir inline etikettir. o yüzden bulunduğu satırda alt satıra geçmek istersek daha önceden öğrendiğimiz yolları uygulamamız gerekir.

<iframe src="https://industryolog.com"></iframe> <br><br>
 
<iframe src="https://industryolog.com" width="400px" height="400px"></iframe>

IFrame’in varsayılan kenarlığını kaldırmak için frameborder attribute’u kullanılır.

Ya da style yardımıyla CSS kodlarına müdahale ederek yapabiliriz. Border özelliğini none yapmak yeterli olacaktır.

 <iframe src="https://industryolog.com"></iframe> <br><br>
 
    <iframe src="https://industryolog.com" width="400px" height="400px"></iframe> <br><br>
 
    <iframe src="https://industryolog.com" frameborder="0"></iframe> <br><br>
 
    <iframe src="https://industryolog.com" style="border: none;"></iframe> <br><br> 

IFrame içerisinde yüklediğiniz içeriğin kaydırılmasını engellemek için scrolling niteliğine no değeri verebilirsiniz.

 <iframe src="https://industryolog.com" style="border: none;" scrolling="no"></iframe> <br><br>

<a> etiketine tıklandığında iframe içerisinde sayfanın açılmasını istersek şu şekilde bir kullanım yoluna gitmeliyiz;

<a href="https://industryolog.com" target="frame_adi">Industryolog'u Aç</a>
    
    <iframe name="frame_adi"></iframe>

Bir sonraki yazımda görüşmek üzere.


Murat Bilginer
21 Şubat 1992'de doğdum. Endüstri Mühendisi olarak lisansımı 2016 yılında tamamladım. Industryolog Akademi - NGenius oluşumlarının kurucusuyum. Şu anda kendi şirketim Brainy Tech ile Web ve Mobil Geliştirme, AWS, Google Cloud Platform Sistemleri için DevOps, Big Data Analiz ve Görselleştirme hizmetleri sunmakta ve Online Eğitimler vermekteyiz.