HTML iframe Yapısı!

HTML iframe Kullanımı. Bir iframe, bir web sayfasınının içindeki web sayfasını görüntülemek için kullanılır.
iframe Sözdizimi
Bir HTML iframe <iframe>
etiketi ile tanımlanır :
<iframe src="URL"></iframe>
Bu src
özellik, satır içi çerçeve sayfasının URL’sini (web adresi) belirtir.
iframe – Yükseklik ve Genişlik Ayarla
İframe boyutunu belirlemek için height
ve width
niteliklerini kullanın.
Yükseklik ve genişlik varsayılan olarak piksel cinsinden belirtilir:
<iframe src="https://armyyazilim.com/" height="200" width="300"></iframe>
Çıktısı;
See the Pen html iframe by ArmyYazılım (@armyyazilim) on CodePen.
Veya iframe’in yüksekliğini ve genişliğini ayarlamak için CSS’yi kullanabilirsiniz:
<iframe src="https://armyyazilim.com/" style="height:200px;width:300px;"></iframe>
İki türlü de aynı sonucu verecektir. Biz burada armyyazılım’ın kendi anasayfasının linkini verdik ancak siz istediğiniz sayfanın linkini verebilirsiniz.
iframe – Kenarlığı Kaldır
Varsayılan olarak, bir iframe etrafında bir kenarlığa sahiptir.
Kenarlığı kaldırmak için style
niteliği ekleyin ve CSS border
özelliğini kullanın :
<iframe src="https://armyyazilim.com/" style="border:none;"></iframe>
CSS ile, iframe kenarlığının boyutunu, stilini ve rengini de değiştirebilirsiniz:
<iframe src="https://armyyazilim.com/" style="border:2px solid red;"></iframe>
iframe – Bir Bağlantı İçin Hedef
Bir iframe, bir link için hedef çerçeve olarak kullanılabilir.
Bağlantının target
niteliği name
iframe’in niteliğine atıfta bulunmalıdır :
<!DOCTYPE html>
<html>
<body>
<h2>Iframe - Target for a Link</h2>
<iframe height="300px" width="100%" src="https://twitter.com/" name="iframe_a"></iframe>
<p><a href="https://armyyazilim.com/" target="iframe_a">Armyyazilim.com</a></p>
<p>Linke tıklamadan önce size ensonhaber.com'u açacaktır ancak linke tıkladığınız zaman armyyazılım'ın siztesine yöneleceksiniz.</p>
</body>
</html>
Çıktısı;
See the Pen html iframe link by ArmyYazılım (@armyyazilim) on CodePen.
HTML iframe Etiketi
Etiket | Açıklama |
---|---|
<iframe> | Satır içi bir çerçeve tanımlar. |
İlginizi çekebilir…
WordPress Kişisel Blog Temaları! (Ücretli – Ücretsiz)
Bu makaleyi beğendiyseniz, lütfen WordPress video eğiticileri için YouTube Kanalımıza abone olun . Bizi Twitter ve İnstagram‘da da bulabilirsiniz …