Тег <iframe>

Встроенный фрейм
  • Категории: Потоковое содержимое, Фразовое содержимое, Встроенное содержимое, Интерактивное содержимое
  • Контекст:

    Где ожидается встроенный контент.

  • Модель:

    Без содержимого.

Тег <iframe> (сокращение от "inline frame" - встроенный фрейм) позволяет вставить в документ независимое окно и загрузить туда другой документ. Чаще фреймы используются для вставки сторонних компонентов, виджетов и т.д. Некоторые сайты запрещают использовать их во фрейме. В этом случае вы увидите предупреждение от браузера.

Атрибуты

  • Глобальные атрибуты
  • src - адрес ресурса
  • srcdoc - документ для рендеринга в iframe
  • name - имя вложенного контекста
  • sandbox - правила безопасности для вложенного контента
  • allowfullscreen - разрешается ли использовать полноэкранный режим
  • allowpaymentrequest - разрешено ли выполнение платежных запросов
  • width - горизонтальный размер
  • height - вертикальный размер

  • Документ в документе

    Элемент <iframe> позволяет вставить один HTML-документ внутрь другого в виде независимого окна - фрейма. Источник фрейма задается в атрибуте src в виде относительного или абсолютного пути до документа:

  • Альтернативный текст

    Между тегами <iframe> можно указать альтернативный текст, который будет выведен на экран, если браузер не смог загрузить фрейм или документ:

  • Навигация и фрейм

    Если задать фрейму имя, то его можно использовать в качестве контекста для ссылок. Таким образом адреса ссылок будут открываться в данном фрейме:

  • Вставляем карту

    Чаще всего фреймы используются для того, чтобы быстро интегрировать сторонние интерфейсы на ваш сайт. Например, Яндекс или Google карты предоставляют специальный код для вставки в виде фрейма:

  • Видео из Youtube

    Видео из Youtube также можно интегрировать через фрейм. Для того, чтобы получить код видео, достаточно найти под ним пункт "Поделиться", а далее выбрать вариант "Встроить":

Поделитесь данной записью с друзьями