Тег CAPTION
| Браузер |
Internet Explorer |
Netscape |
Opera |
Safari |
Mozilla |
Firefox |
| Версия |
5.5 |
6.0 |
7.0 |
6.0 |
7.0 |
8.0 |
7.0 |
8.0 |
9.0 |
1.0 |
1.7 |
1.0 |
2.0 |
| Поддерживается |
Да |
Да |
Да |
Да |
Да |
Да |
Да |
Да |
Да |
Да |
Да |
Да |
Да |
| HTML: |
3.2 |
4 |
XHTML: |
1.0 |
1.1 |
Описание
Тег <CAPTION> предназначен для создания заголовка
к таблице и может размещаться только внутри контейнера <TABLE>,
причем сразу после открывающего тега. Такой заголовок представляет собой текст,
по умолчанию отображаемый перед таблицей и описывающий ее содержание.
Синтаксис
<table>
<caption>Текст</caption>
...
</table>
Параметры
- align
- Определяет выравнивание заголовка по горизонтали.
- valign
- Устанавливает расположение заголовка до или после таблицы.
Закрывающий тег
Обязателен.
Пример 1. Использование тега <CAPTION>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title>Тег CAPTION</title>
</head>
<body>
<table width="100%" border="1" cellspacing="0"
cellpadding="4">
<caption>
Таблица 3.2. Демонстрация катаболических процессов организма
</caption>
<tr>
<th> </th>
<th>Чебурашка</th>
<th>Крокодил Гена</th>
<th>Шапокляк</th>
</tr>
<tr>
<td>Съел, кг</td>
<td>5</td>
<td>2</td>
<td>1</td>
</tr>
<tr>
<td>Выпил, л</td>
<td>6</td>
<td>8</td>
<td>2</td>
</tr>
<tr>
<td>Смог, раз</td>
<td>5</td>
<td>5</td>
<td>1</td>
</tr>
</table>
</body>
</html>
Результат данного примера показан ни рис. 1.
Рис. 1. Вид заголовка таблицы в браузере Opera
Описание параметров тега <CAPTION>
Параметр ALIGN
| HTML: |
3.2 |
4 |
XHTML: |
1.0 |
1.1 |
Описание
Параметр align определяет выравнивание заголовка
относительно таблицы. Результат его действия зависит от используемого браузера
и установленного значения.
Синтаксис
<caption align="left | center | right | top | bottom">...</caption>
Аргументы
- left
- В браузере Internet Explorer и Opera располагает заголовок сверху и выравнивает его по левому краю таблицы. В Firefox заголовок располагается слева от таблицы.
- right
- В браузере Internet Explorer и Opera располагает заголовок сверху таблицы
и выравнивает его по правому краю таблицы. В браузере Netscape параметр игнорируется,
а в Firefox заголовок располагается от таблицы справа.
- center
- Заголовок располагается сверху таблицы по ее центру.
- top
- Результат аналогичен действию параметра center,
но в отличие от него входит в спецификацию HTML 4 и понимается всеми браузерами.
- bottom
- Заголовок размещается внизу таблицы по ее центру.
Значение по умолчанию
center — для браузера Internet Explorer;
top — для других браузеров.
Аналог CSS
text-align
Пример 2. Выравнивание заголовка
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title>Тег CAPTION, параметр align</title>
</head>
<body>
<table width="100%" border="1" cellspacing="1"
cellpadding="4">
<caption
align="bottom">
Пример таблицы
</caption>
<tr>
<th>#</th>
<th>Чебурашка</th>
<th>Крокодил Гена</th>
<th>Шапокляк</th>
</tr>
<tr>
<td>1</td>
<td>FXD</td>
<td>URN</td>
<td>LWK</td>
</tr>
</table>
</body>
</html>
Результат данного примера показан ни рис. 2.
Рис. 2. Размещение заголовка под таблицей
Параметр VALIGN
| HTML: |
3.2 |
4 |
XHTML: |
1.0 |
1.1 |
Описание
Параметр valign предназначен для размещения заголовка
до таблицы или после нее. Этот параметр работает только в браузере Internet
Explorer, а для всех остальных применяется align.
Тем не менее, параметр align корректно действует
и для IE, поэтому сочетание параметров align и
valign необходимо только для этого браузера, когда
требуется одновременное выравнивание заголовка по вертикали и горизонтали.
Синтаксис
<caption valign="bottom | top">...</caption>
Аргументы
- bottom
- Заголовок размещается под таблицей.
- top
- Заголовок размещается перед таблицей.
Значение по умолчанию
top
Пример 3. Заголовок внизу таблицы
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title>Тег CAPTION, параметр valign</title>
</head>
<body>
<table width="60%" border="1" cellspacing="1" cellpadding="4">
<caption align="right"
valign="bottom">
Пример таблицы
</caption>
<tr><td>...</td></tr>
</table>
</body>
</html>
