Основные теги для таблицы
- <table> – парный тег для создания таблицы
- <caption – парный тег для вставки заголовков в таблицу
(вставляется сразу после тега <table>) - <tr> – парный тег для создания строки для таблицы
- <td> – парный тег для создания ячеек для таблицы
- <th> – парный тег для создания заголовочных ячеек для таблицы
Атрибуты и теги для <table>
- bgcolor="" – задает цвет фона в таблицы
- background=""; – вставка текстуры в таблицу
- border="" – толщина рамки таблицы
- bordercolor="" – цвет рамки
- cellpadding="" – внутренний отступ в ячейках
- cellspacing="" – внутренний отступ между столбцов
- width="" – ширина таблицы
- height="" – высота таблицы
- frame="void" – убирает внешнею рамку таблицы
- frame="above" – создание внешней рамки сверху
- frame="below" – создание внешней рамки снизу
- frame="lhs" – создание внешней рамки с лева
- frame="rhs" – создание внешней рамки справа
- frame="hsides" – создание внешней рамки, сверху и снизу
- frame="vsides" – создание внешней рамки, слева и справа
- cols="" – задает число столбцов
(для больших таблиц, информация для браузера )
Атрибуты для тега <tr>
- valign="middle" – центрует текст по середины ячейки
- valign="bottom" – центрует текст снизу ячейки
- valign="top" – центрует текст сверху ячейки
Атрибуты для тега <td>
- rowspan="" – объединяет ячейки по вертикали с нижними
- colspan="" – объединяет ячейки по горизонтали с слева на право
Атрибуты для тега <col>
- width="" – ширина колонок
- span="" – задает количество колонок для ширины колонок
Атрибуты для тега <caption>
- align="top" – делает заголовки сверху таблицы (по умолчанию )
- align="left" – делает заголовок слева таблицы (прижимая его вверх)
- align="right" – делает заголовок справа таблицы (прижимая его вверх)
- align="bottom" – делает заголовки снизу таблицы
Пример построения таблицы
Пример стилизаций таблицы в css
| Выберите комплект | Стандарт | Голд | Премиум | Основной видеокурс |  |
|
|
|---|---|---|---|
| Продвинутый видеокурс |  |
|
|
| VIP модуль | |
|
|
| 1500 руб | 1500 руб | 1500 руб | |
| Заказать | Заказать | Заказать |