www html, html уроки, html теги, css, верстка
статьи html уроки книги по css и html урокам вопросы и ответы Помощь сайту
Главная страница > Теги ШТМЛ > Тег IFRAME
Теги ШТМЛ
Все теги
!DOCTYPE
A
ABBR
ACRONYM
ADDRESS
AREA
B
BASE
BASEFONT
BDO
BGSOUND
BIG
BLOCKQUOTE
BODY
BR
BUTTON
CAPTION
CENTER
CITE
CODE
COL
COLGROUP
DD
DEL
DFN
DIV
DL
DT
EM
EMBED
FIELDSET
FONT
FORM
FRAME
FRAMESET
H1...H6
HEAD
HR
ШТМЛ
I
IFRAME
IMG
INPUT
INS
KBD
LABEL
LEGEND
LI
LINK
MAP
MARQUEE
META
NOBR
NOEMBED
NOFRAMES
NOSCRIPT
OBJECT
OL
OPTGROUP
OPTION
P
PARAM
PRE
Q
SAMP
SCRIPT
SELECT
SMALL
SPAN
STRIKE
STRONG
STYLE
SUB
SUP
TABLE
TBODY
TD
TEXTAREA
TFOOT
TH
THEAD
TITLE
TR
TT
UL
VAR
WBR
XMP
Теги по типам
файл
Звук
Имаги
Объекты
Скрипты
Списки
Ссылки
Таблица
контент
Форматирование
Формы
Фреймы

Тег IFRAME

Браузер Internet ExplorerInternet Explorer NetscapeNetтscape OperaОпера SafariSafari Файер фохMozilla Firefox
Версия 5.5 6.0 7.0 8.0 8.0 9.0 7.0 8.0 9.2 9.5 1.3 2.0 3.1 1.5 2.0 3.0
Поддерживается Да Да Да Да Да Да Да Да Да Да Да Да Да Да Да Да
ШТМЛ: 3.2 4 XШТМЛ: 1.0 1.1

Описание

Тег <IFRAME> создает плавающий фрейм, который находится внутри обычного объекта, он позволяет загружать в область заданных размеров любые другие независимые файлы.

Тег <IFRAME> является контейнером, содержание которого игнорируется браузерами, не поддерживающих данный тег. Для таких браузеров можно указать альтернативный контент, который увидят пользователи. Он должен располагаться между элементами <IFRAME> и </IFRAME>.

Синтаксис

<iframe>...</iframe>

Параметры

align
Определяет как фрейм будет выравниваться по краю, а также способ обтекания его контентом.
frameborder
Устанавливает, отображать границу вокруг фрейма или нет.
height
Высота фрейма.
hspace
Горизонтальный отступ от фрейма до окружающего контента.
name
Имя фрейма.
scrolling
Способ отображения полосы прокрутки во фрейме.
src
Путь к файлу, содержимое которого будет загружаться во фрейм.
vspace
Вертикальный отступ от фрейма до окружающего контента.
width
Ширина фрейма.

Закрывающий тег

Обязателен.

Пример 1. Использование тега <IFRAME>

ШТМЛ 4.01IE 5.5IE 6IE 7Op 9.5Sa 3.1Ff 2.0Ff 3.0

<!DOCTYPE ШТМЛ PUBLIC "-//W3C//DTD ШТМЛ 4.01 Transitional//EN" "http://www.w3.org/TR/ШТМЛ4/loose.dtd">
<html>
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
  <title>Тег IFRAME</title>
 </head>
 <body>  

 <iframe src="banner.ШТМЛ" width="468" height="60" align="left">
    Ваш браузер не поддерживает плавающие фреймы!
 </iframe>

 </body>
</html>

Описание параметров тега <IFRAME>

Параметр ALIGN

ШТМЛ: 3.2 4 XШТМЛ: 1.0 1.1

Описание

Для плавающего фрейма можно указать его положение на web-странице или задать способ обтекания контентом или другими элементами web-страницы. Способ выравнивания задается параметром align тега <IFRAME>.

Синтаксис

<iframe align="absmiddle | baseline | bottom | left | middle | right | texttop | top">...</iframe>

Аргументы

absmiddle
Выравнивание середины фрейма по середине текущей строки.
baseline
Выравнивание фрейма по базовой линии текущей строки.
bottom
Выравнивание нижней границы фрейма по окружающему контенту.
left
Выравнивает фрейм по левоой стороне окна.
middle
Выравнивание середины фрейма по базовой линии текущей строки.
right
Выравнивает фрейм по правой стороне окна.
texttop
Верхняя граница фрейма выравнивается по самому высокому контентовому элементу текущей строки.
top
Верхняя граница фрейма выравнивается по самому высокому элементу текущей строки.

Наиболее популярные параметры — left и right, создающие обтекание контента вокруг фрейма. Чтобы контент не прилегал плотно к содержимому фрейма, рекомендуется в теге <IFRAME> добавляем параметр hspace и vspace, задающих расстояние до контента в пикселах.

Значение по умолчанию

bottom

Пример 2. Выравнивание плавающего фрейма

ШТМЛ 4.01IE 5.5IE 6IE 7Op 9.5Sa 3.1Ff 2.0Ff 3.0

<!DOCTYPE ШТМЛ PUBLIC "-//W3C//DTD ШТМЛ 4.01 Transitional//EN" "http://www.w3.org/TR/ШТМЛ4/loose.dtd">
<html>
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
  <title>Тег IFRAME, параметр align</title>
 </head>
 <body>

  <iframe src="main.ШТМЛ" width="220" height="60" 
   align="right"></iframe>
  <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit...</p>

 </body>
</html>

Параметр FRAMEBORDER

ШТМЛ: 3.2 4 XШТМЛ: 1.0 1.1

Описание

По умолчанию вокруг содержимого фрейма рисуется рамка с эффектом трехмерности. Чтобы ее скрыть применяется параметр frameborder.

Синтаксис

<iframe frameborder="yes | no">...</iframe> <iframe frameborder="0 | 1"> ...</iframe>

Аргументы

yes (или 1)
Отображает рамку вокруг фрейма.
no (или 0)
Скрывает рамку вокруг фрейма.

Значение по умолчанию

1

Пример 3. Сокрытие исходной рамки вокруг фрейма

ШТМЛ 4.01IE 5.5IE 6IE 7Op 9.5Sa 3.1Ff 2.0Ff 3.0

<!DOCTYPE ШТМЛ PUBLIC "-//W3C//DTD ШТМЛ 4.01 Transitional//EN" "http://www.w3.org/TR/ШТМЛ4/loose.dtd">
<html>
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
  <title>Тег IFRAME, параметр frameborder</title>
 </head>
 <body>

  <iframe src="tip.ШТМЛ" width="340" height="50" 
  frameborder="0" style="border: 2px solid black"></iframe>

 </body>
</html>

Параметр HEIGHT и WIDTH

ШТМЛ: 3.2 4 XШТМЛ: 1.0 1.1

Описание

Для изменения размеров фрейма средствами ШТМЛ предусмотрены параметры width и height. Допускается использовать значения в пикселах или процентах. Если установлена процентная запись, то размеры фрейма вычисляются относительно родительского элемента — контейнера, где находится тег <IFRAME>. В случае отсутствия родительского контейнера, в его качестве выступает окно браузера. Иными словами, width="100%" означает, что фрейм будет занимать всю ширину web-страницы.

Если значение высоты или ширины не заданы, то фрейм автоматически принимает размер 300 х 150 пикселов.

Синтаксис

<iframe height="высота">...</iframe> <iframe width="ширина">...</iframe>

Аргументы

Любое целое положительное число в пикселах или процентах.

Значение по умолчанию

width — 300 пикселов, height — 150 пикселов.

Пример 4. Ширина и высота фрейма

ШТМЛ 4.01IE 5.5IE 6IE 7Op 9.5Sa 3.1Ff 2.0Ff 3.0

<!DOCTYPE ШТМЛ PUBLIC "-//W3C//DTD ШТМЛ 4.01 Transitional//EN" "http://www.w3.org/TR/ШТМЛ4/loose.dtd">
<html>
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
  <title>Тег IFRAME, параметр width</title>
 </head>
 <body>

  <iframe src="tip.ШТМЛ" width="150" height="150"></iframe>

 </body>
</html>

Параметр HSPACE и VSPACE

ШТМЛ: 3.2 4 XШТМЛ: 1.0 1.1

Описание

Для любого фрейма можно задать невидимые отступы по горизонтали и вертикали с помощью, соответственно, параметров hspace и vspace. Особенно это актуально при обтекании содержимого фрейма контентом. В этом случае, чтобы контент не «наезжал» плотно на границу фрейма, необходимо вокруг него добавляем пустое пространство.

Синтаксис

<iframe hspace="поля по горизонтали">...</iframe> <iframe vspace="поля по вертикали">...</iframe>

Аргументы

Любое целое положительное число в пикселах.

Значение по умолчанию

0

Пример 5. Поля вокруг фрейма

ШТМЛ 4.01IE 5.5IE 6IE 7Op 9.5Sa 3.1Ff 2.0Ff 3.0

<!DOCTYPE ШТМЛ PUBLIC "-//W3C//DTD ШТМЛ 4.01 Transitional//EN" "http://www.w3.org/TR/ШТМЛ4/loose.dtd">
<html>
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
  <title>Тег IFRAME, параметр hspace</title>
 </head>
 <body>

  <iframe src="tip.ШТМЛ" width="150" height="150"  hspace="5" vspace="7"></iframe>

 </body>
</html>

Параметр NAME

ШТМЛ: 3.2 4 XШТМЛ: 1.0 1.1

Описание

В обычном ШТМЛ-файле при переходе по ссылке, в окне браузера текущий файл заменяется новым. Чтобы направить содержимое во фрейм, он должен иметь уникальное имя, задаваемое тегом name. В этом случае при создании ссылки у тега <A> требуется указать параметр target, в качестве значения которого выступает имя фрейма.

Синтаксис

<iframe name="имя">...</iframe>

Аргументы

Для указания имени используется набор символов, включая числа и буквы. При обращении к фрейму по имени соблюдайте то же написание, что и в параметре name.

Значение по умолчанию

Нет.

Пример 6. Открытие ссылки во фрейме

ШТМЛ 4.01IE 5.5IE 6IE 7Op 9.5Sa 3.1Ff 2.0Ff 3.0

<!DOCTYPE ШТМЛ PUBLIC "-//W3C//DTD ШТМЛ 4.01 Transitional//EN" "http://www.w3.org/TR/ШТМЛ4/loose.dtd">
<html>
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
  <title>Тег IFRAME, параметр name</title>
 </head>
 <body>

  <iframe name="hero" src="0.ШТМЛ" 
  width="600" height="100"  align="left">
  </iframe>

  <p><a href="1.ШТМЛ" target="hero">Чебурашка</a><br>
   <a href="2.ШТМЛ" target="hero">Крокодил Гена</a><br>
   <a href="3.ШТМЛ" target="hero">Шапокляк</a>

 </body>
</html>

Параметр SCROLLING

ШТМЛ: 3.2 4 XШТМЛ: 1.0 1.1

Описание

Если содержимое фрейма не помещается в отведенные размеры, автоматически появляются полосы прокрутки для просмотра информации. В некоторых случаях, полосы прокрутки нарушают дизайн web-страницы, поэтому от них можно отказаться. Для управления отображением полос прокрутки используется параметр scrolling.

Синтаксис

<iframe scrolling="auto | no | yes">...</iframe>

Аргументы

auto
Полосы прокрутки добавляются браузером только по необходимости, в том случае, когда содержимое фрейма превышает его видимую часть.
no
Запрещает отображение полос прокрутки.
yes
Всегда вызывает появление полос прокрутки, независимо от объема информации.

Значение по умолчанию

auto

Пример 7. Сокрытие полос прокрутки

ШТМЛ 4.01IE 5.5IE 6IE 7Op 9.5Sa 3.1Ff 2.0Ff 3.0

<!DOCTYPE ШТМЛ PUBLIC "-//W3C//DTD ШТМЛ 4.01 Transitional//EN" "http://www.w3.org/TR/ШТМЛ4/loose.dtd">
<html>
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
  <title>Тег IFRAME, параметр scrolling</title>
 </head>
 <body>

  <iframe src="tip.ШТМЛ" width="150" height="450" scrolling="no"></iframe>

 </body>
</html>

Параметр SRC

ШТМЛ: 3.2 4 XШТМЛ: 1.0 1.1

Описание

Указывает адрес файла (URL), который будет загружаться во фрейм. Это может быть ШТМЛ-файл, изображение или серверная программа. Допустимо использовать не только путь к файлу, но также имя функции JavaScript, которое возвращает значение.

Синтаксис

<iframe src="URL">...</iframe>

Аргументы

В качестве значения принимается полный или относительный путь к файлу.

Значение по умолчанию

Нет.

Пример 8. Путь к файлу

ШТМЛ 4.01IE 5.5IE 6IE 7Op 9.5Sa 3.1Ff 2.0Ff 3.0

<!DOCTYPE ШТМЛ PUBLIC "-//W3C//DTD ШТМЛ 4.01 Transitional//EN" "http://www.w3.org/TR/ШТМЛ4/loose.dtd">
<html>
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
  <title>Тег IFRAME, параметр src</title>
 </head>
 <body>

  <iframe src="/source/sample.ШТМЛ" width="450" height="450"></iframe>

 </body>
</html>

Copyright 2009 Все права засчищены, по всем вопросам пишите по адресу admin@www-html.ru

О нашем Internet проекте | Наши планы | Контент нашего сайта | Есть ошибки... | Технологии | Поддержать проект