Тег создает плавающий фрейм, который находится внутри обычного документа, он позволяет загружать в область заданных размеров любые другие независимые документы.
Тег
Синтаксис
Атрибуты
align Определяет как фрейм будет выравниваться по краю, а также способ обтекания его текстом. allowtransparency Устанавливает прозрачный фон фрейма, через который виден фон страницы. frameborder Устанавливает, отображать границу вокруг фрейма или нет. height Высота фрейма. hspace Горизонтальный отступ от фрейма до окружающего контента. marginheight Отступ сверху и снизу от содержания до границы фрейма. marginwidth Отступ слева и справа от содержания до границы фрейма. name Имя фрейма. sandbox Позволяет задать ряд ограничений на контент загружаемый во фрейме. scrolling Способ отображения полосы прокрутки во фрейме. seamless Определяет, что содержимое фрейма должно отображаться так, словно оно является частью документа. src Путь к файлу, содержимое которого будет загружаться во фрейм. srcdoc Хранит содержимое фрейма непосредственно в атрибуте. vspace Вертикальный отступ от фрейма до окружающего контента. width Ширина фрейма.
Также для этого тега доступны универсальные атрибуты и события.
Закрывающий тег
HTML5 IE Cr Op Sa Fx
Тег IFRAMEВаш браузер не поддерживает плавающие фреймы!
С помощью какого тега создается плавающий фрейм
Скачай курс в приложении
Перейти в приложение Открыть мобильную версию сайта
Public user contributions licensed under cc-wiki license with attribution required
Плавающие фреймы
Разговор о фреймах будет неполным без упоминания плавающих фреймов. Так называется фрейм, который можно добавлять в любое место веб-страницы. Еще одно его название — встроенный фрейм, он называется так из-за своей особенности встраиваться прямо в тело веб-страницы. На рис. 13.4 приведен пример такого фрейма.
Рис. 13.4. Плавающий фрейм на веб-странице
Во фрейм можно загружать HTML-документ и прокручивать его содержимое независимо от остального материала на веб-странице. Размеры фрейма устанавливаются самостоятельно согласно дизайну сайта или собственных предпочтений.
Создание плавающего фрейма происходит с помощью тега iframe> , он имеет обязательный параметр src , указывающий на загружаемый во фрейм документ (листинг 13.10).
Листинг 13.10. Использование тега iframe>
Плавающий фрейм
- Тег, используемый для создания плавающего фрейма. ">iframe src="http://www.znannya.org/rgb.html" width="300" height="120">
В данном примере ширина и высота фрейма устанавливается через параметры width и height . Сам загружаемый во фрейм файл называется rgb.html. Заметьте, что если содержимое не помещается целиком в отведенную область, появляются полосы прокрутки.
Еще одно удобство плавающих фреймов состоит в том, что в него можно загружать документы по ссылке. Для этого требуется задать имя фрейма через параметр name , а в теге указать это же имя в параметре target (листинг 13.11).
Листинг 13.11. Загрузка документа во фрейм
Плавающий фрейм
RGB | CMYK | HSB
- Тег, используемый для создания плавающего фрейма. ">iframe src="http://www.znannya.org/model.html" name="color" width="100%" height="300">
В данном примере добавлено несколько ссылок, они открываются во фрейме с именем color .
С помощью какого тега создается плавающий фрейм
Поддержка браузерами:
Браузер
Opera
IE
Firefox
Mozilla
Netscape
Поддержка
да
да
да
да
да
Параметры тега:
Параметры
frameborder
align
height
marginheight
Закрывающий тег
marginwidth
hspace
name
scrolling
src
vspace
width
да
Тег создает плавающий фрейм, который находится внутри обычного документа, он позволяет загружать в область заданных размеров любые другие независимые документы.
Тег является контейнером, содержание которого игнорируется браузерами, не поддерживающих данный тег. Для таких браузеров можно указать альтернативный текст, который увидят пользователи. Он должен располагаться между элементами и .
Пример:
Параметры тега
Параметр служит для изменения размеров фрейма по высоте . Допускается использовать значения в пикселах или процентах. Если установлена процентная запись, то размеры фрейма вычисляются относительно родительского элемента — контейнера, где находится тег . В случае отсутствия родителя, в его качестве выступает окно браузера.
Если значение высоты и ширины не заданы, то фрейм автоматически принимает размер 300 х 150 пикселов.
Пример:
.
Параметр служит для изменения размеров фрейма по ширине . Допускается использовать значения в пикселах или процентах. Если установлена процентная запись, то размеры фрейма вычисляются относительно родительского элемента — контейнера, где находится тег . В случае отсутствия родительского контейнера, в его качестве выступает окно браузера.
Если значение высоты и ширины не заданы, то фрейм автоматически принимает размер 300 х 150 пикселов.
Пример:
.
Для плавающего фрейма можно указать его положение на веб-странице или задать способ обтекания текстом или другими элементами веб-страницы. Наиболее популярные параметры — left и right , создающие обтекание текста вокруг фрейма. Чтобы текст не прилегал плотно к содержимому фрейма, рекомендуется в теге добавить параметр hspace и vspace , задающих расстояние до текста в пикселах. В качестве зарезервированных имен используются следующие:
absmiddle Выравнивание середины фрейма по середине текущей строки.
baseline Выравнивание фрейма по базовой линии текущей строки.
bottom Выравнивание нижней границы фрейма по окружающему тексту.
left Выравнивает фрейм по левому краю окна.
middle Выравнивание середины фрейма по базовой линии текущей строки.
right Выравнивает фрейм по правому краю окна.
top Верхняя граница фрейма выравнивается по самому высокому элементу строки.
texttop Верхняя граница фрейма выравнивается по самому высокому текстовому элементу текущей строки.
Пример:
.
Выводит или не выводит рамку вокруг фрейма. Может принимать значения: 1 (по умолчанию, рамка выводится), 0 (рамка не выводится), yes (аналогично 1), no (аналогично 0)
Пример:
.
Если содержимое фрейма не помещается в отведенные размеры, автоматически появляются полосы прокрутки для просмотра информации. В некоторых случаях, полосы прокрутки нарушают дизайн веб-страницы, поэтому от них можно отказаться. Для управления отображением полос прокрутки используется параметр scrolling .В качестве зарезервированных имен используются следующие:
yes Всегда вызывает появление полос прокрутки.
no Запрещает отображение полос прокрутки.
auto Полосы прокрутки добавляются браузером только по необходимости, в том случае, когда содержимое фрейма превышает его видимую часть.
Пример:
.
Параметр устанавливает отступы содержимого от верхнего и нижнего края фрейма.
Пример:
.
Параметр устанавливает отступы содержимого от левого и правого края фрейма.
Пример:
.
Для любого фрейма можно задать отступы по горизонтали. Особенно это актуально при обтекании содержимого фрейма текстом. В этом случае, чтобы текст не «наезжал» плотно на границу фрейма, необходимо вокруг него добавить пустое пространство.
Пример:
.
В обычном HTML-документе при переходе по ссылке, в окне браузера текущий документ заменяется новым. Чтобы направить содержимое во фрейм, он должен иметь уникальное имя, задаваемое атрибутом name . В этом случае при создании ссылки у тега требуется указать параметр target , в качестве значения которого выступает имя фрейма. Для указания имени используется набор символов, включая числа и буквы. При обращении к фрейму по имени соблюдайте то же написание, что и в параметре name .
Пример:
.
Указывает адрес файла (URL), который будет загружаться во фрейм. Это может быть HTML-документ, изображение или серверная программа. Допустимо использовать не только путь к файлу, но также имя функции JavaScript, которое возвращает значение.
Пример:
.
Для любого фрейма можно задать отступы по вертикали. Особенно это актуально при обтекании содержимого фрейма текстом. В этом случае, чтобы текст не «наезжал» плотно на границу фрейма, необходимо вокруг него добавить пустое пространство.