Содержание
Встроенные фреймы, обычно называемые просто «iframes», являются единственным типом фрейма, разрешенным в HTML5. Эти рамки по сути являются разделом вашей страницы, который вы «вырезали». В пространство, которое вы вырезали из страницы, вы можете затем подать на внешней веб-странице. По сути, iframe — это еще одно окно браузера, установленное прямо на вашей веб-странице. Вы видите кодовые фреймы, обычно используемые на веб-сайтах, которые должны включать внешний контент, такой как карта Google или видео с YouTube. Оба этих популярных сайта используют встраиваемый код iframe.
Как использовать элемент IFRAME
Элемент использует глобальные элементы HTML5, а также несколько других элементов. Четыре также являются атрибутами в HTML 4.01:
- — URL для источника фрейма
- — высота окна
- — ширина окна
- — название окна
И три новых в HTML5:
srcdoc
— HTML для источника фрейма. Этот атрибут имеет приоритет над любым URL в
ЦСИ
атрибут
песочница
— список функций, которые должны быть разрешены или запрещены в окне фрейма
бесшовный
— сообщает пользовательскому агенту, что iframe должен отображаться так, как будто он является невидимой частью родительского документа
Чтобы создать простой iframe, вы устанавливаете исходный URL, ширину и высоту:
Обратите внимание, что вы можете не использовать значения пикселей для настроек вашего iframe, но вместо этого можете принять решение использовать процент. Если вы создаете адаптивный веб-сайт, размер которого должен меняться в зависимости от размера экрана, эти проценты будут важны.
Есть также некоторые атрибуты, которые действительны в HTML 4.01, но устарели в HTML5. Поскольку большинство веб-сайтов сегодня используют HTML5 +, эти атрибуты вы не захотите использовать (но вы можете увидеть их в некоторых старых документах).
- Вместо того, чтобы использовать
элемент для ссылки на описание
- Вместо этого используйте CSS
поплавок
свойство
allowtransparency
Вместо этого используйте CSS
фон
свойство сделать ифрам прозрачным
- — вместо того, чтобы использовать
граница
Свойство CSS
MARGINHEIGHT
Вместо этого используйте CSS
поле
свойство
MARGINWIDTH
Вместо этого используйте CSS
поле
свойство
- Вместо этого используйте CSS
переполнение
свойство
Поддержка браузера IFRAME
Элемент поддерживается всеми современными браузерами:
- Android
- Хром
- Fire Fox
- Internet Explorer 2+
- iOS / Safari Mobile
- Netscape 7+
- Опера 3+
- Сафари
Если в приведенном выше списке номер версии не указан, то это потому, что все версии этого браузера поддерживают его.
Следует помнить, что хотя все браузеры поддерживают
По-прежнему ограничена поддержка некоторых функций HTML5.
- С помощью
переполнение
отключить прокрутку не надежно. Если вы не хотите использовать полосы прокрутки в своих фреймах, вы должны продолжать использовать
прокрутки
приписывать.
srcdoc
,
песочница
, а также
бесшовный
В настоящее время атрибуты не поддерживаются никакими браузерами.
Связывание с Iframes
Когда вы даете свои фреймы
или же
Затем вы можете указать свои ссылки на этот кадр с атрибутом на
элемент. Затем, когда пользователь нажимает на ссылку, она открывается внутри ссылочного iframe, а не в текущем окне.
Попробуй сам. Введите следующее на веб-странице:
Если документ открыт в
не имеет никакого
установить, тогда все эти ссылки будут открыты в том же фрейме, что и
документ.
Вы можете использовать эту функцию, чтобы сделать ссылки в одном
изменить содержимое другого
на той же странице.
IFrames и безопасность
Элемент сам по себе не является угрозой безопасности для вас или ваших читателей. К сожалению, у фреймов плохая репутация, поскольку они могут использоваться вредоносными веб-сайтами для включения контента, который может заразить компьютер посетителя, не видя его на странице. Это делается с помощью ссылки на невидимое
и эти сценарии выделяют вредоносный код. Пользователь щелкает ссылку и думает, что ссылка не работает, потому что ничего не произошло, но сценарий был запущен там, где он не мог его увидеть.
Есть также компьютерные вирусы, которые будут внедрять невидимые
в ваши веб-страницы, эффективно превращая ваш сайт в ботнет. Они могут сделать это через
и другие атаки.
Что нужно помнить при включении
на вашей веб-странице ваши пользователи находятся в такой же безопасности, как и содержимое всех сайтов, на которые вы ссылаетесь. Если у вас есть причина считать сайт ненадежным, не делайте на него ссылки ни в коем случае и, безусловно, не включайте его содержимое в
. Однако размещение ссылок на собственные страницы в рамках фреймов не создает угрозы безопасности для вас или ваших пользователей.
Оригинальная статья Дженнифер Крынин. Отредактированный 7/7/16 Джереми Жираром