iframe Etiketi

iframe etiketi, bir web sitesinin içeriğini başka bir web sitesine gömmenize olanak tanır. Yeni bir pencere veya sekme açmaya gerek kalmadan video, resim veya makale gibi içerikleri görüntülemek için kullanılır.

Gömülen web sitesinin içeriği, o sitenin tasarımına sahip olacaktır. Aynı zamanda, web sitemizin CSS stilleri ve JavaScript kodumuz iframe etiketinin içeriğini etkilemeyecektir.

iframe içeriğine kendi JavaScript'imizi uygulayabiliriz, ancak bunun için özel yöntemler kullanmamız gerekir.

iframe etiketi, web sitelerinde YouTube ve diğer platformlardan video gömmek ve ayrıca başka kaynaklardan makale ve resimler görüntülemek için yaygın olarak kullanılır.

Nitelikler

Nitelik	Açıklama
`src`	Gömülecek sayfanın adresini belirtir.
`srcdoc`	Iframe'in içeriğini doğrudan nitelik içinde tanımlamanızı sağlar.
`frameborder`	Iframe'in etrafına bir çerçeve ekler. `yes` değeri çerçeve ekler (varsayılan), `no` değeri ise çerçeveyi kaldırır.
`scrolling`	Iframe içindeki kaydırma çubuklarını belirler. `auto` değeri - gerektiğinde kaydırma (varsayılan), `yes` değeri - her zaman kaydırma, `no` değeri - kaydırma yok.

Örnek

Web sitemize başka bir siteyi (örnek olarak code.mu'yu alalım) gömülü bir iframe olarak ekleyelim:

<iframe src="https://code.mu/" width="600" height="400"></iframe>

Örnek

Web sitemize YouTube'tan bir video gömelim:

<iframe
	src="https://www.youtube.com/embed/KzQrHpB1H8U"
	allowfullscreen
	width="400"
	height="400">
</iframe>

Örnek

İçeriği doğrudan iframe içinde yazalım:

<iframe
	srcdoc="<h1>Başlık</h1><p>metin</p>"
	width="300"
	height="200">
</iframe>