<iframe> — это единственное, что осталось от фреймовых структур, используемое в наши дни. Тут я писал, почему фреймы давно и безнадежно устарели.
<iframe> представляет собой плавающий фрейм, в который загружается HTML-документ. Для загрузки необходимо указать директорию с помощью любимого атрибута src. Делаем так: src="МойДокумент.html". Главной особенностью <iframe> (которая помогла ему выжить в мире web) — это расположение в любой части документа. Вы можете поместить его внизу сайта, слева, сбоку, посередине. Как вам удобно. А еще вы можете регулировать его размеры. Атрибут scrolling отвечает за возможность прокрутки содержимого (по умолчанию scrolling="yes").
У <iframe> есть еще много полезных атрибутов. align определяет, по какому краю выравнивается плавающий фрейм. С помощью атрибута allowtranseparency вы можете сделать фрейм прозрачным. Выглядит довольно эффектно. В сочетании с frameborder="no" этот атрибут может создать впечатление, что фрейма на странице и нет вовсе.
Некоторые другие полезные атрибуты.
1) sandbox. Регулирует загружаемый контент. С его помощью вы можете, например, разрешить отправлять данные формы (sandbox="allow-forms"). Можно установить открытие ссылок из фрейма в исходном документе. По умолчанию этот атрибут не указан.
2) seamless. При указании этого атрибута вы будете наблюдать нечто схожее с верхней картинкой.
3) vspace и hspace. Как и везде - отступ содержимого документа, в котором находится плавающий фрейм от его границы.
Новый атрибут добавили в HTML5.1. allowfullscreen может менять способ отображения контента. А в HTML5.2 подъехал атрибут allowpaymentrequest, необходимый для использования Payment Request API.
Вот и все, что вам нужно знать про <iframe>. Залайкайте, если материал был полезен и ждите следующих статей!