Тег iframe

Тег iframe позволяет встраивать содержимое одного сайта в другой. Он используется для отображения контента, такого как видео, изображения или статьи, без необходимости открывать новое окно или вкладку.

Содержимое вставляемого сайта будет иметь дизайн именного этого сайта. При этом CSS стили нашего сайта, а также наш JavaScript код не будут оказывать влияние на содержимое тега iframe.

К содержимому iframe можно применить наш JavaScript, но для этого нужно действовать особыми методами.

Тег iframe широко используется на сайтах для встраивания видео с YouTube и других платформ, а также для отображения статей и изображений с других источников.

Атрибуты

Атрибут	Описание
`src`	Указывает адрес страницы, которая должна быть встроена.
`srcdoc`	Позволяет задать содержимое ифрейма непосредственно в атрибуте.
`frameborder`	Задает рамку фокруг ифрейма. Значение `yes` задает рамку (по умолчанию), а значение `no` убирает рамку.
`scrolling`	Задает полосы прокрутки внутри ифрейма. Значение `auto` - прокрутка по необходимости (по умолчанию), значение `yes` - прокрутка всегда, значение `no` - прокрутки нет.

Пример

Давайте вставим на наш сайт ифрейм с другим сайтом (для примера возьмем code.mu):

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

Пример

Вставим на наш сайт видео с YouTube:

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

Пример

Напишем содержимое прямо в ифрейме:

<iframe
	srcdoc="<h1>head</h1><p>text</p>"
	width="300"
	height="200">
</iframe>