- •Описание
- •Синтаксис
- •Закрывающий тег
- •Описание
- •Синтаксис
- •Параметры
- •Закрывающий тег
- •Значение по умолчанию
- •Параметр href Описание
- •Значение по умолчанию
- •Описание
- •Описание
- •Синтаксис
- •Параметры
- •Закрывающий тег
- •Синтаксис
- •Аргументы
- •Значение по умолчанию
- •Описание
- •Синтаксис
- •Параметры
- •Закрывающий тег
- •Значение по умолчанию
- •Аналог css
- •Параметр valign Описание
- •Описание
- •Синтаксис
- •Закрывающий тег
- •Значение по умолчанию
- •Аналог css
- •Описание
- •Синтаксис
- •Параметры
- •Закрывающий тег
- •Значение по умолчанию
- •Аналог css
- •Описание
- •Синтаксис
- •Закрывающий тег
- •Описание
- •Синтаксис
- •Закрывающий тег
- •Описание
- •Синтаксис
- •Закрывающий тег
- •Описание
- •Синтаксис
- •Параметры
- •Закрывающий тег
- •Описание
- •Синтаксис
- •Закрывающий тег
- •Описание
- •Синтаксис
- •Параметры
- •Значение по умолчанию
- •Параметр height и width Описание
- •Синтаксис
- •Параметры
- •Закрывающий тег
- •Параметр align Описание
- •Синтаксис
- •Аргументы
- •Значение по умолчанию
- •Синтаксис
- •Параметры
- •Закрывающий тег
- •Параметр action Описание
- •Синтаксис
- •Аргументы
- •Значение по умолчанию
- •Значение по умолчанию
- •Описание
- •Синтаксис
- •Параметры
- •Закрывающий тег
- •Значение по умолчанию
- •Аналог css
- •Синтаксис
- •Параметры
- •Закрывающий тег
- •Параметр border Описание
- •Синтаксис
- •Параметры
- •Закрывающий тег
- •Описание
- •Синтаксис
- •Параметры
- •Синтаксис
- •Параметры
- •Значение по умолчанию
- •Параметр alt Описание
- •Синтаксис
- •Аргументы
- •Значение по умолчанию
- •Параметр lowsrc Описание
- •Синтаксис
- •Параметры
- •Закрывающий тег
- •Значение по умолчанию
- •Параметр alt Описание
- •Значение по умолчанию
- •Параметр value Описание
- •Описание
- •Синтаксис
- •Закрывающий тег
- •Описание
- •Синтаксис
- •Закрывающий тег
- •Описание
- •Синтаксис
- •Параметры
- •Закрывающий тег
- •Синтаксис
- •Параметры
- •Закрывающий тег
- •Описание
- •Синтаксис
- •Параметры
- •Синтаксис
- •Параметры
- •Закрывающий тег
- •Синтаксис
- •Параметры
- •Закрывающий тег
- •Синтаксис
- •Параметры
- •Закрывающий тег
- •Значение по умолчанию
- •Описание
- •Синтаксис
- •Закрывающий тег
- •Описание
- •Синтаксис
- •Закрывающий тег
- •Описание
- •Синтаксис
- •Закрывающий тег
- •Описание
- •Синтаксис
- •Параметры
- •Закрывающий тег
- •Значение по умолчанию
- •Параметр src Описание
- •Синтаксис
- •Параметры
- •Закрывающий тег
- •Параметр multiple Описание
- •Описание
- •Описание
- •Синтаксис
- •Закрывающий тег
- •Описание
- •Синтаксис
- •Параметры
- •Закрывающий тег
- •Значение по умолчанию
- •Аналог css
- •Закрывающий тег
- •Синтаксис
- •Аргументы
- •Значение по умолчанию
- •Аналог css
- •Описание
- •Синтаксис
- •Параметры
- •Закрывающий тег
- •Значение по умолчанию
- •Аналог css
- •Значение по умолчанию
- •Аналог css
Значение по умолчанию
Зависит от браузера и его версии, обычно используется белый цвет фона.
Аналог css
background-color
Пример 3. Цвет фона
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <style type="text/css"> TFOOT { color: white /* Цвет текста */ } </style> </head> <body> <table width="600" border="1" cellspacing="0" bordercolor="#333333" bgcolor="#f0f0f0"> <tfoot align="center" bgcolor="#333333"> <tr> <td colspan="2"> ... </td> </tr> </tfoot> <tbody> <tr> <td> ... </td> <td> ... </td> </tr> </tbody> </table> </body> </html>
Параметр VALIGN
Описание
Устанавливает вертикальное выравнивание содержимого ячеек в контейнере <TFOOT>. По умолчанию контент ячейки располагается по ее вертикали в центре.
Синтаксис
<tfoot valign="top | middle | bottom | baseline">...</tfoot>
Аргументы
top
Выравнивание содержимого ячеек по верхнему краю строки.
middle
Выравнивание по середине.
bottom
Выравнивание по нижнему краю.
baseline
Выравнивание по базовой линии, при этом происходит привязка содержимого ячеек строки к одной линии.
Значение по умолчанию
middle
Аналог CSS
vertical-align
Пример 4. Выравнивание по вертикали
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <body> <table width="600" border="1" cellspacing="0" bordercolor="#333333"> <tfoot align="center" valign="bottom" bgcolor="orange"> <tr> <td colspan="2" height="50"> ... </td> </tr> </tfoot> <tbody align="right" valign="top"> <tr> <td> ... </td> <td> ... </td> </tr> <tr> <td> ... </td> <td> ... </td> </tr> </tbody> </table> </body> </html>
Описание
Тег <TH> предназначен для создания одной ячейки таблицы, которая обозначается как заголовочная. Текст в такой ячейке отображается браузером обычно жирным шрифтом и выравнивается по центру. Тег <TH> должен размещаться внутри контейнера <TR>, который в свою очередь располагается внутри тега <TABLE>.
Синтаксис
<table> <tr> <th>...</th> </tr> </table>
Параметры
align
Определяет выравнивание содержимого ячейки по горизонтали.
background
Задает фоновый рисунок в ячейке.
bgcolor
Цвет фона ячейки.
bordercolor
Цвет рамки.
colspan
Объединяет горизонтальные ячейки.
height
Высота ячейки.
nowrap
Запрещает перенос строк.
rowspan
Объединяет вертикальные ячейки.
valign
Выравнивание содержимого ячейки по вертикали.
width
Ширина ячейки.
Закрывающий тег
Не обязателен.
Пример 1. Использование тега <TH>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <body> <table border="0" cellpadding="7" cellspacing="0"> <tr> <th colspan="2" bgcolor="#D3EDF6" align="center"> ... </th> </tr> <tr> <td valign="top" align="center"> ... </td> <td width="98%" valign="top"> ... </td> </tr> </table> </body> </html>
Описание параметров тега <TH>
Параметр ALIGN
Описание
Задает выравнивание содержимого ячейки по горизонтали.
Синтаксис
<th align="left | center | right | justify">...</th>
Аргументы
left
Выравнивание содержимого ячейки по левому краю.
center
Выравнивание по центру.
right
Выравнивание по правому краю.
justify
Выравнивание по ширине (одновременно по правому и левому краю).
Значение по умолчанию
center
Аналог CSS
text-align
Пример 2. Выравнивание содержимого ячейки
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <body> <table width="600" border="1"> <tr> <th align="right"> ... </th> <td align="center"> ... </td> </tr> </table> </body> </html>
Параметр BACKGROUND
Описание
Определяет изображение, которое будет использоваться в качестве фонового рисунка ячейки таблицы. В отличие от обычных изображений, для фона не устанавливаются ширина и высота, и он всегда отображается в натуральную величину с масштабом 100%. Если рисунок по размеру меньше ширины или высоты ячейки, то картинка повторяется по горизонтали вправо и вниз, выстраиваясь, как мозаика. По этой причине на месте стыка фоновых картинок могут возникнуть видимые перепады, заметные для посетителей сайта. При выборе фонового рисунка убедитесь, что обеспечен достаточный контраст между ним и содержимым ячейки. В качестве фона допускается использовать анимированные изображения в формате GIF, но они отвлекают внимание читателей.
Синтаксис
<th background="URL">...</th>
Аргументы
Любой допустимый адрес изображения — можно использовать относительный или абсолютный путь.
Значение по умолчанию
Нет.
Аналог CSS
background-image
Пример 3. Фоновый рисунок в ячейке
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <body> <table width="600"> <tr> <th background="/images/rules.gif"> ... </th> <td> ... </td> </tr> </table> </body> </html>
Параметр BGCOLOR
Описание
Устанавливает цвет фона ячейки.
Синтаксис
<th bgcolor="цвет">...</th>
Аргументы
Значение цвета можно задавать двумя способами.
1. По его названию
Браузеры поддерживают некоторые цвета по их названию.
2. По шестнадцатеричному значению
Для задания цветов используются числа в шестнадцатеричном коде. Шестнадцатеричная система, в отличие от десятичной системы, базируется, как следует из ее названия, на числе 16. Цифры будут следующие: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, F. Цифры от 10 до 15 заменены латинскими буквами. Числа больше 15 в шестнадцатеричной системе образуются объединением двух чисел в одно. Например, числу 255 в десятичной системе соответствует число FF в шестнадцатеричной системе. Чтобы не возникало путаницы в определении системы счисления, перед шестнадцатеричным числом ставят символ решетки #, например #666999. Каждый из трех цветов — красный, зеленый и синий — может принимать значения от 00 до FF. Таким образом, обозначение цвета разбивается на три составляющие #rrggbb, где первые два символа отмечают красную компоненту цвета, два средних — зеленую, а два последних — синюю.
Значение по умолчанию
Зависит от браузера и его версии, обычно используется белый цвет фона.
Аналог CSS
background-color
Пример 4. Цвет фона ячейки
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <body text="white"> <table bgcolor="black" width="600"> <tr> <th bgcolor="#ffcc00"> ... </th> </tr> <tr> <td> ... </td> </tr> </table> </body> </html>
Параметр BORDERCOLOR
Описание
Устанавливает цвет рамки вокруг ячейки. Рамка показывается, когда установлен параметр border с ненулевым значением у тега <TABLE>.
Синтаксис
<th bordercolor="цвет">...</th>
Аргументы
См. параметр BGCOLOR.
Значение по умолчанию
Зависит от браузера и операционной системы.
Пример 5. Цвет рамки
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <body> <table bordercolor="black" border="1" width="100%"> <tr> <th bordercolor="red"> ... </th> <td> ... </td> </tr> </table> </body> </html>
Параметр COLSPAN
Описание
Устанавливает число ячеек, которые должны быть объединены по горизонтали. Этот параметр имеет смысл для таблиц, состоящих из нескольких строк. Например, как для таблицы, показанной на рис. 1.
ячейка 1 |
|
ячейка 2 |
ячейка 3 |
Рис. 1. Пример таблицы, где используется горизонтальное объединение ячеек
В приведенной на рис.1 таблице содержатся две строки и две колонки, причем верхние горизонтальные ячейки объединены с помощью параметра colspan.
Синтаксис
<th colspan="число">...</th>
Аргументы
Любое целое положительное число больше 1.
Значение по умолчанию
1
Пример 6. Объединение ячеек
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <body> <table width="200" border="1" align="center" cellpadding="4" cellspacing="0" bordercolor="#333333"> <tr bgcolor="#FBF0DB"> <th colspan="2">ячейка 1</th> </tr> <tr> <td>ячейка 2</td> <td>ячейка 3</td> </tr> </table> </body> </html>
Параметр HEIGHT
Описание
Браузер сам устанавливает высоту таблицы и ее ячеек исходя из их содержимого. Однако при использовании параметра height высота ячеек будет изменена. Здесь возможны два варианта. Если значение height меньше, чем содержимое ячейки, то этот параметр будет проигнорирован. В случае, когда установлена высота ячейки, превышающая ее содержимое, добавляется пустое пространство по вертикали.
Синтаксис
<th height="значение">...</th>
Аргументы
Любое целое значение в пикселах или процентах от доступного пространства.
Значение по умолчанию
Высота вычисляется на основе содержимого ячейки.
Аналог CSS
height
Пример 7. Высота ячейки
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <body> <table cellpadding="10" bgcolor="#ffcc00" align="center" width="100%"> <tr> <th height="50"> ... </th> </tr> <tr> <td> ... </td> </tr> </table> </body> </html>
Параметр NOWRAP
Описание
Добавление параметра nowrap к тегу <TH> заставляет текст внутри ячейки отображаться без переносов, одной сплошной строкой. Неправильное использование этого атрибута может привести к тому, что таблица будет слишком широкой и не поместится целиком на веб-страницу. Как следствие, появится горизонтальная полоса прокрутки. В любом случае, пользоваться подобной таблицей будет неудобно, из-за чего применение параметра nowrap осуждается в спецификации HTML 4.
Синтаксис
<th nowrap>...</th>
Аргументы
Нет.
Значение по умолчанию
По умолчанию параметр nowrap не установлен.
Пример 8. Использование параметра nowrap
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <body> <table width="400"> <tr> <th nowrap> ... </th> </tr> <tr> <td> ... </td> </tr> </table> </body> </html>
Параметр ROWSPAN
Описание
Устанавливает число ячеек, которые должны быть объединены по вертикали. Этот параметр имеет смысл для таблиц, состоящих из нескольких строк. Например, как для таблицы, показанной на рис. 2.
ячейка 1 |
ячейка 2 |
ячейка 3 |
Рис. 2. Пример таблицы, где используется вертикальное объединение ячеек
В приведенной на рис. 2 таблице содержатся две строки и две колонки, причем левые вертикальные ячейки объединены с помощью параметра rowspan.
Синтаксис
<th rowspan="число">...</th>
Аргументы
Любое целое положительное число больше 1.
Значение по умолчанию
1
Пример 9. Объединение ячеек
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <body> <table width="200" border="1" align="center" cellpadding="4" cellspacing="0" bordercolor="#333333"> <tr> <th rowspan="2" bgcolor="#FBF0DB">ячейка 1</th> <td>ячейка 2</td> </tr> <tr> <td>ячейка 3</td> </tr> </table> </body> </html>
Параметр VALIGN
Описание
Устанавливает вертикальное выравнивание содержимого ячейки. По умолчанию контент ячейки располагается по ее вертикали в центре.
Синтаксис
<th valign="top | middle | bottom | baseline">...</th>
Аргументы
top
Выравнивание содержимого ячейки по верхнему краю строки.
middle
Выравнивание по середине.
bottom
Выравнивание по нижнему краю.
baseline
Выравнивание по базовой линии, при этом происходит привязка содержимого ячейки к одной линии.
Значение по умолчанию
middle
Аналог CSS
vertical-align
Пример 10. Выравнивание в ячейке
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <body> <table width="60%"> <tr bgcolor="#ffcc00" bordercolor="white"> <th valign="top"> ... </th> </tr> <tr> <td> ... </td> </tr> </table> </body> </html>
Параметр WIDTH
Описание
Задает ширину ячейки. Если общая ширина содержимого превышает указанную ширину ячейки, то браузер будет пытаться «втиснуться» в заданные размеры за счет форматирования текста. В случае, когда это невозможно, например, в ячейке находятся изображения, параметр width будет проигнорирован, и новая ширина ячейки будет вычислена на основе ее содержимого.
Синтаксис
<th width="значение">...</th>
Аргументы
Любое целое значение в пикселах или процентах от доступного пространства.
Значение по умолчанию
Ширина вычисляется на основе содержимого ячейки.
Аналог CSS
width
Пример 11. Ширина ячеек
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <body> <table cellpadding="10" border="1" bordercolor="red"> <tr> <th width="20%"> ... </th> <th width="80%"> ... </th> </tr> <tr> <td> ... </td> </tr> </table> </body> </html>
Описание
Элемент <THEAD> предназначен для хранения одной или нескольких строк, которые представлены вверху таблицы. Допустимо использовать не более одного элемента <THEAD> в пределах одной таблицы, и он должен идти в исходном коде сразу после тега <TABLE>.
Синтаксис
<table> <thead> <tr> <td> ... </td> </tr> </thead> <tfoot>... </tfoot> <tbody>... </tbody> </table>
Параметры
align
Определяет выравнивание текста в строке.
bgcolor
Цвет фона ячеек, которые расположены внутри контейнера <THEAD>.
valign
Выравнивание содержимого ячеек по вертикали.
Закрывающий тег
Не обязателен.
Пример 1. Использование тега <THEAD>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <body> <table width="600"> <thead align="center" bgcolor="#ffcc00"> <tr> <td> ... </td> <td> ... </td> </tr> </thead> <tbody align="right" bgcolor="silver"> <tr> <td> ... </td> <td> ... </td> </tr> </tbody> </table> </body> </html>
Описание параметров тега <THEAD>
Параметр ALIGN
Описание
Задает выравнивание по горизонтали для всех ячеек в пределах <THEAD>. Если требуется применить разное выравнивание для каждой ячейки, воспользуйтесь стилями или используйте параметр align для тега <TD> или <TH>.
Синтаксис
<thead align="left | center | right | justify">...</thead>
Аргументы
left
Выравнивание по левому краю.
center
Выравнивание по центру.
right
Выравнивание по правому краю.
justify
Выравнивание по ширине (одновременно по правому и левому краю).
Значение по умолчанию
left
Аналог CSS
text-align
Пример 2. Выравнивание в строке
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <body> <table width="600" border="1" cellspacing="0" bordercolor="#333333"> <thead align="center" bgcolor="#ffcc00"> <tr> <td colspan="2"> ... </td> </tr> </thead> <tbody align="right"> <tr> <td> ... </td> <td> ... </td> </tr> </tbody> </table> </body> </html>
Параметр BGCOLOR
Описание
Устанавливает цвет фона ячеек, расположенных в контейнере <THEAD>.
Синтаксис
<thead bgcolor="цвет">...</thead>
Аргументы
Значение цвета можно задавать двумя способами.
1. По его названию
Браузеры поддерживают некоторые цвета по их названию.
2. По шестнадцатеричному значению
Для задания цветов используются числа в шестнадцатеричном коде. Шестнадцатеричная система, в отличие от десятичной системы, базируется, как следует из ее названия, на числе 16. Цифры будут следующие: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, F. Цифры от 10 до 15 заменены латинскими буквами. Числа больше 15 в шестнадцатеричной системе образуются объединением двух чисел в одно. Например, числу 255 в десятичной системе соответствует число FF в шестнадцатеричной системе. Чтобы не возникало путаницы в определении системы счисления, перед шестнадцатеричным числом ставят символ решетки #, например #666999. Каждый из трех цветов — красный, зеленый и синий — может принимать значения от 00 до FF. Таким образом, обозначение цвета разбивается на три составляющие #rrggbb, где первые два символа отмечают красную компоненту цвета, два средних — зеленую, а два последних — синюю.