| WebReference
Элемент <iframe> (от англ. inline frame — встроенный фрейм) создаёт встроенный фрейм, который находится внутри обычного документа, он позволяет загружать в область заданных размеров любые другие независимые документы.
<iframe> является контейнером, содержание которого игнорируется браузерами, не поддерживающими данный элемент. Для таких браузеров можно указать альтернативный текст, который увидят пользователи. Он должен располагаться между тегами <iframe> и </iframe>.
Синтаксис
<iframe>...</iframe>
Атрибуты
- align
- Определяет, как фрейм будет выравниваться по краю, а также способ обтекания его текстом.
- allowfullscreen
- Разрешает для фрейма полноэкранный режим.
- frameborder
- Устанавливает, отображать границу вокруг фрейма или нет.
- height
- Высота фрейма.
- hspace
- Горизонтальный отступ от фрейма до окружающего контента.
- marginheight
- Отступ сверху и снизу от содержания до границы фрейма.
- marginwidth
- Отступ слева и справа от содержимого до границы фрейма.
- name
- Имя фрейма.
- sandbox
- Позволяет задать ряд ограничений на контент загружаемый во фрейме.
- scrolling
- Способ отображения полосы прокрутки во фрейме.
- seamless
- Определяет, что содержимое фрейма должно отображаться так, словно оно является частью документа.
- src
- Путь к файлу, содержимое которого будет загружаться во фрейм.
- srcdoc
- Хранит содержимое фрейма непосредственно в атрибуте.
- vspace
- Вертикальный отступ от фрейма до окружающего контента.
- width
- Ширина фрейма.
Пример
<!DOCTYPE HTML> <html> <head> <meta charset=»utf-8″> <title>IFRAME</title> </head> <body> <iframe src=»page/banner.
html» align=»left»>
Ваш браузер не поддерживает встроенные фреймы!
</iframe>
</body>
</html> Спецификация
| Спецификация | Статус |
|---|---|
| WHATWG HTML Living Standard | Живой стандарт |
| HTML5 | Рекомендация |
| HTML 4.01 Specification | Рекомендация |
Каждая спецификация проходит несколько стадий одобрения.
- Recommendation (Рекомендация) — спецификация одобрена W3C и рекомендована как стандарт.
- Candidate Recommendation (Возможная рекомендация) — группа, отвечающая за стандарт, удовлетворена, как он соответствует своим целям, но требуется помощь сообщества разработчиков по реализации стандарта.
- Proposed Recommendation (Предлагаемая рекомендация) — на этом этапе документ представлен на рассмотрение Консультативного совета W3C для окончательного утверждения.
- Working Draft (Рабочий проект) — более зрелая версия черновика после обсуждения и внесения поправок для рассмотрения сообществом.
- Editor’s draft (Редакторский черновик) — черновая версия стандарта после внесения правок редакторами проекта.
- Draft (Черновик спецификации) — первая черновая версия стандарта.
Браузеры
| 4 | 12 | 1 | 4 | 1 | 1 |
| 1 | 1 | 6 | 1 |
В таблице браузеров применяются следующие обозначения.
- — элемент полностью поддерживается браузером;
- — элемент браузером не воспринимается и игнорируется;
- — при работе возможно появление различных ошибок, либо элемент поддерживается с оговорками.
Число указывает версию браузреа, начиная с которой элемент поддерживается.
Фреймы
См. также
- Адаптивное встраивание
- Добавление медиа-контента
- Отзывчивый веб-дизайн
Практика
- Вставка JSFiddle
- Имя фрейма
- Картинка во фрейме
- Размеры фрейма
- Создание фрейма
- Ссылка во фрейм
- Ссылки во фрейме
Элементы HTML
Атрибуты
Значения
Типы элементов
Аудио и видео
Документ
Изображения
Объекты
Списки
Ссылки
Таблицы
Текст
Формы
Фреймы
Тег iframe
HTML5CSS.
ru
ЛУЧШИЙ САЙТ ДЛЯ РАЗРАБОТЧИКОВ
❮Назад Полный HTML Ссылки Дальше ❯
Пример
Встроенный фрейм помечен следующим образом:
<iframe src=»https://html5css.ru»></iframe>
Пример
Встроенный фрейм помечен следующим образом:
<!DOCTYPE HTML>
<html>
<head>
<title>Тег IFRAME</title>
<body>
<iframe src=»frame_b.htm»>
Ваш браузер не поддерживает плавающие фреймы!
</iframe>
</body>
</html>
Пример
Пример содержания файла frame_b.htm
<html>
<head>
</head>
<body>
<h4>Frame B</h4>
</body>
</html>
Определение и использование
Тег <iframe> определяет встроенный фрейм.
Встроенный фрейм используется для встраивания другого документа в текущий документ HTML.
Поддержка браузера
| Элемент | |||||
|---|---|---|---|---|---|
| <iframe> | Да | Да | Да | Да | Да |
Советы и примечания
Совет: Чтобы иметь дело с обозревателями, не поддерживающими <iframe>, добавьте текст между открывающим тегом <iframe> и закрывающим тегом </iframe>.
Совет: Используйте CSS для стиля <iframe> (даже для включения полосы прокрутки).
Различия между HTML 4,01 и HTML5
HTML5 добавил некоторые новые атрибуты, и несколько атрибутов HTML 4,01 удалены из HTML5.
Различия между HTML и XHTML
Атрибуты
= Новый в HTML5.
| Атрибут | Значение | Описание |
|---|---|---|
| align | left right top middle bottom | Не поддерживается в HTML5. Задает выравнивание <iframe> в соответствии с окружающими элементами |
| frameborder | 1 0 | Не поддерживается в HTML5. Указывает, отображать ли рамку вокруг <iframe> |
| height | pixels | Задает высоту <iframe> |
| longdesc | URL | Не поддерживается в HTML5. Задает страницу, содержащую подробное описание содержимого <iframe> |
| marginheight | pixels | Не поддерживается в HTML5. Задает верхние и нижние поля содержимого <iframe> |
| marginwidth | pixels | Не поддерживается в HTML5. Задает левое и правое поля содержимого <iframe> |
| name | text | Задает имя <iframe> |
| sandbox | allow-forms allow-pointer-lock allow-popups allow-scripts allow-top-navigation | Включает дополнительный набор ограничений для содержимого в <iframe> |
| scrolling | yes no auto | Не поддерживается в HTML5. Указывает, отображать ли полосы прокрутки в <iframe> |
| src | URL | Задает адрес документа для встраивания в <iframe> |
| srcdoc | HTML_code | Задает HTML-содержимое страницы, которое должно отображаться в <iframe> |
| width | pixels | Задает ширину <iframe> |
Глобальные атрибуты
Тег <iframe> также поддерживает Глобальные атрибуты в HTML.
Атрибуты события
Тег <iframe> также поддерживает Атрибуты событий в HTML.
Похожие страницы
HTML Учебник: HTML Iframes
HTML DOM Ссылки: IFrame Object
Параметры CSS по умолчанию
В большинстве обозревателей элемент <iframe> будет отображаться со следующими значениями по умолчанию:
iframe:focus {
outline: none;
}
iframe[seamless] {
display: block;
}
❮Назад Полный HTML Ссылки Дальше ❯
Популярное
html картинка
как вставить картинку в html
цвет текста фона
размер текста html
цвет размер шрифта html
формы html
список html
таблица html
как сделать ссылку в html
html элементы
Copyright 2018-2020 HTML5CSS.
Правила и Условия Политика конфиденциальности О нас Контакты
: Элемент Inline Frame — HTML: Язык гипертекстовой разметки
HTML-элемент Пользователи, использующие вспомогательные технологии, такие как программа чтения с экрана, могут использовать атрибут Без этого заголовка им приходится переходить в
Результат
title в