Тег iframe определяет встроенную область (рамку), которая может отображать содержимое отдельно взятого документа или даже другого веб-сайта в ограниченном пространстве на текущей веб-странице. Содержимое внутри области существует независимо от окружающей страницы. Две страницы: родительская и дочерняя, отображаемая в рамке, могут взаимодействовать друг с другом через JavaScript или серверный язык программирования.
Атрибут src указывает URL-адрес страницы для загрузки во встроенную область, но сам элемент iframe также может содержать текст или разметку в качестве резервного содержимого для отображения в браузерах, не поддерживающих этот элемент (например: очень старые браузеры, текстовые браузеры и так далее).
Любые CSS стили, применяемые к родительскому элементу, не будут применяться к содержимому встроенной области, также как стили, примененные к встроенному содержимому, не будут распространяться на родительский элемент.
Можно указать размер для встроенной области с помощью необязательных атрибутов width и height или с помощью CSS. Обычно размер по умолчанию равен 300px в ширину и 150px в высоту, но, в зависимости от браузера, размер может быть иным. Большинство браузеров по умолчанию отображают содержимое элемента iframe с узкой рамкой, которую можно изменить или удалить с помощью CSS свойства.
Если содержимое тега iframe превышает размеры элемента, то появляются полосы прокрутки, позволяющие пользователям прокручивать содержимое во встроенной области. Вы можете отключить полосы прокрутки с помощью CSS объявления : hidden, но в этом случае у пользователя не будет возможности увидеть скрытое содержимое.
Атрибуты
height:
Указывает высоту элемента в пикселях.
name:
Определяет имя для элемента.
Значение этого атрибута может быть использовано для ссылки на элемент в JavaScript, либо в качестве значения для атрибута target элемента или , либо в качестве значения для атрибута formtarget элемента или.
sandbox:
Применяет набор ограничений на содержимое встроенной области в качестве меры безопасности в случае, если в ней отображается ненадежный веб-сайт.
Значением атрибута может быть либо пустая строка (sandbox=""), это значение указывает, что применяются все ограничения, либо список определенных значений, разделенных пробелами, которые будут снимать конкретные ограничения:
- "" - применяет все ограничения, снимаемые перечисленными ниже значениями. Таким образом ограничивая содержимое фрейма влиять на родительский элемент, изолируя страницу, отображаемую во фрейме, в виртуальной песочнице, поэтому любой вредоносный код не сможет нанести вред родительской странице, сайту или компьютеру пользователя.
- allow-forms - разрешает отправку данных форм.
- allow-same-origin - указывает, что информация представленная в iframe имеет тот же источник, что и информация представленная в содержащем его документе.
- allow-scripts - разрешает выполнение сценариев (исключая всплывающие окна).
- allow-top-navigation - разрешает использовать ссылки внутри содержимого iframe для перемещения по содержащему его документу.
Примечание: атрибут sandbox не поддерживается в IE9 и более ранних версиях, и в Opera.
seamless:
Указывает, что содержимое iframe должно выглядеть так, словно оно является частью документа (без рамки и полос прокрутки). Возможные значения логического атрибута seamless:
iframe seamless iframe seamless="" iframe seamless="seamless"
Примечание: атрибут seamless поддерживается только в Chrome и Safari6+.
src:
Указывает адрес документа, который будет отображен во встроенном фрейме.
width:
Указывает ширину элемента в пикселях.