И все таки сегодня собрался мыслью и решился выложить их в свой блог. Напряженные рабочие дни выбивают все силы и желания. Но понимаю, что не один я такой, и за меня никто писать не будет. Вооружаюсь мыслями и рвусь в бой.
Продолжаю выкладывать посты об основах html. И сегодня рассмотрим как создаются и отображаются таблицы в html-документах. Думаю, что одним постом я не отделаюсь, поэтому запасаемся терпением и начинаем по порядку.
Тег <table> и </table> служит для создания таблицы и в свою очередь служит контейнером для элементов, описывающих содержание таблицы. Таблица состоит из строк, для этого служит тег <tr> и </tr>. Строки, в свою очередь состоят из ячеек и задаются с помощью тегов <th> и </th> — для заголовочных ячеек, <td> и </td> — для ячеек-данных.
Синтаксис тега выглядит так:
<table>
<tr>
<td>контент</td>
</tr>
</table>
Рассмотрим атрибуты таблицы:
align="значение" — задает горизонтальное положение таблицы и может иметь следующие значения:
- left — выравнивает таблицу по левому краю;
- center — выравнивает таблицу по центру;
- right — выравнивание таблицы по правому краю.
valign="значение" - задает вертикальное положение контента ячейки и может иметь следующие значения:
- top — выравнивает контент ячейки по верхнему краю;
- middle — выравнивает контент ячейки по центру, оно же является значением по умолчанию;
- bottom — выравнивает контент ячейки по нижнему краю;
- baseline — выравнивает контент ячейки по базовой линии.
width="ширина" — задает ширину таблицы, значение в пикселах или процентах. Значение используется, если оно не конфликтует с соседними значениями в соседних ячейках того же столбца.
height="высота" — задает высоту таблицы, значение в пикселах или процентах. Значение используется, если оно не конфликтует с соседними значениями в соседних ячейках того же столбца.
background="URL" - задает в качестве фона таблицы графический файл, изображение. URL — любой допустимый путь к изображению (относительный или абсолютный).
bgcolor="цвет" — задает цвет фона таблицы. Может использоваться совместно с background.
border="толщина" — задает толщину рамки таблицы, значение в пикселах. По умолчанию рамка не рисуется.
bordercolor="цвет" — задает цвет рамки таблицы.
cellpadding="значение" — задает расстояние между границей ячейки и ее контентом. Так как по умолчанию текст немного сливается с рамкой таблицы, то параметр cellpadding не дает слияния и тем самым улучшает визуальное восприятие. Значение в пикселах.
cellspacing="значение" — задает расстояние между внешними границами ячеек. Значение в пикселах.
cols="значение" — задает какое количество столбцов будет в таблице. Значение в пикселах.
frame="значение" — задает прорисовку рамок вокруг таблицы. Параметр может иметь следующие значения:
- box или border — рамка рисуется со всех четырех сторон;
- void — таблица без внешних рамок;
- above — рамка рисуется только с верхней стороны;
- below — рамка рисуется только с нижней стороны;
- lhs — рамка рисуется только с левой стороны;
- rhs — рамка рисуется только с правой стороны;
- hsides — рисуется нижняя и верхняя сторона рамки;
- vsides — рисуется левая и правая сторона рамки.
Толщина границы рамки указывается с помощью параметра border. При отсутствии этого параметра рамки будут отсутствовать.
rules="значение" — задает границы между ячейками. Параметр может иметь следующие значения:
- all — линия отображается вокруг каждой ячейки таблицы;
- cols — линия отображается между колонками;
- non — скрывает все линии внутри таблицы;
- rows — линии только между строками таблицы;
- groups — показывает линии между группами, которые образуются тегами <thead>, <tfoot>, <tbody>, <colgroup>.
В следующей статье выложу остальные теги и параметры html-таблиц и закрепим все это примерами. А пока откланиваюсь и набираюсь сил для следующего материала.
Желаю успехов и хороших майских выходных. ![]()



