HTML <iframe> тег

  • Предыдущая страница <i>
  • Следующая страница <img>

Определение и использование

<iframe> Тег defines inline frame (inline frame).

Инлайн-фрейм используется для внедрения другого документа в текущий HTML-документ.

Совет:Используйте CSS для настройки <iframe> стиль (см. примеры ниже).

Совет:Лучше всего всегда использовать <iframe> Содержит атрибут title. Экранное чтение может использовать этот атрибут для чтения о <iframe> Описание содержимого.

Дополнительная литература:

Учебник HTML:HTML Iframe

Руководство по HTML DOM:Объект IFrame

Пример

Пример 1

Маркер инлайнового фрейма:

<iframe src="https://www.codew3c.com" title="CodeW3C.com Online Tutorial"></iframe>

Попробуйте сами

Пример 2

Добавление и удаление рамки iframe (используя CSS):

<iframe src="/index.asp" width="100%" height="300" style="border:1px solid black;">
</iframe>
<iframe src="/index.asp" width="100%" height="300" style="border:none;">
</iframe>

Попробуйте сами

Атрибут

Атрибут Значение Описание
allow Определяет стратегию функций <iframe>.
allowfullscreen
  • true
  • false
 Установите значение true, если <iframe> может активировать режим полного экрана с помощью метода requestFullscreen().
allowpaymentrequest
  • true
  • false
 Установите значение true, если разрешается跨源 <iframe> вызывать Payment Request API.
height Пиксели Определяет высоту <iframe>. По умолчанию высота составляет 150 пикселей.
loading
  • eager
  • lazy
 Определяет, должен ли браузер немедленно загружать iframe или откладывать загрузку iframe до тех пор, пока не будут выполнены某些 условия.
name Текст Определяет имя <iframe>.
referrerpolicy
  • no-referrer
  • no-referrer-when-downgrade
  • origin
  • origin-when-cross-origin
  • same-origin
  • strict-origin-when-cross-origin
  • unsafe-url
 Определяет информацию о ссылке, которая будет отправлена при получении iframe.
sandbox
  • allow-forms
  • allow-pointer-lock
  • allow-popups
  • allow-same-origin
  • allow-scripts
  • allow-top-navigation
 Включает набор дополнительных ограничений для содержимого <iframe>.
src URL Определяет адрес документа, который нужно嵌入 в <iframe>.
srcdoc Код HTML Определяет HTML-контент страницы, которая будет отображаться в <iframe>.
width Пиксели Определяет ширину <iframe>. По умолчанию ширина составляет 300 пикселей.

Глобальные свойства

<iframe> Тег также поддерживает Глобальные атрибуты в HTML.

атрибуты событий

<iframe> Тег также поддерживает Атрибуты событий в HTML.

Стандартные CSS настройки

Большинство браузеров будут использовать следующие значения по умолчанию для отображения <iframe> Элемент:

iframe:focus {
  outline: none;
}
iframe[seamless] {
  display: block;
}

Поддержка браузеров

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Поддержка Поддержка Поддержка Поддержка Поддержка
  • Предыдущая страница <i>
  • Следующая страница <img>