Заголовки таблиц.
Любая ячейка таблицы может быть определена как заголовок. Для того чтобы сделать ячейку таблицы заголовком нужно вместо знакомого тега <td> использовать тег <th>.
Например, вот так:
<table>
<tr>
<th>Данная ячейка является заголовком</th>
</tr>
</table>
Как правило, текст ячейки определённый в качестве заголовка отображается браузерами жирным шрифтом по центру ячейки.
Ну что давайте попробуем сделать некоторые ячейки нашей таблицы заголовками? смотрим пример:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Заголовок таблицы</title>
</head>
<body>
<table border="1" width="400" cellpadding="3" cellspacing="0">
<tr>
<th>Продукт</th><th>Белки</th><th>Жиры</th><th>Углеводы</th><th>ккал</th>
</tr>
<tr>
<th>Хлеб ржаной</th><td>4,7</td><td>0,7</td><td>49,8</td><td>214</td>
</tr>
<tr>
<th>Молоко</th><td>2,8</td><td>3,2</td><td>4,7</td><td>58</td>
</tr>
<tr>
<th>Картофель</th><td>2</td><td>0,1</td><td>19,7</td><td>83</td>
</tr>
<tr>
<th>Свинина</th><td>11,4</td><td>49,3</td><td>9</td><td>489</td>
</tr>
<tr>
<th>Итого:</th><td>20,9</td><td>53,3</td><td>83,2</td><td>844</td>
</tr>
</table>
</body>
</html>
К тегу <th> могут применятся точно такие же атрибуты как и к тегу <td> о них мы говорили в 4 главе поэтому повторятся не буду, а просто перечислю их:
· width - Ширина ячейки в процентах или пикселях.
· height - Высота ячейки в процентах или пикселях.
· align - Выравнивает текст в ячейке:
o left - по левому краю.
o right - по правому краю.
o center - по центру.
o justify - по левому и правому краю.
· valign - Выравнивает текст в ячейке по вертикали:
o top - по верхнему краю.
o middle - по центру.
o bottom - по нижнему краю.
o baseline - по базовой линии.
· colspan - количество столбцов занимаемое ячейкой.
· rowspan - количество рядов занимаемое ячейкой.
· bgcolor - Цвет фона ячейки.
· background - Задает фоновый рисунок в ячейке.
· bordercolor - Цвет бордюра.
· title - Всплывающая подсказка
· nowrap - Запрещает перенос строк в ячейке.
Думаю понятно, а посему идем дальше..
Дата добавления: 2015-04-19; просмотров: 888;