[ Ссылка ]
В видеоуроке демонстрируется создание таблиц в документах html и их разнообразное форматирование, включая задание свойств CSS, объединение ячеек, выравнивание содержимого ячеек и т.д.
Содержание видеоурока:
00:20 – общий принцип создания таблиц html.
01:30 – создание таблицы, теги «table», «tr» (строка таблицы), «td» (ячейка таблицы).
05:15 – свойство display:table и его характеристики.
06:55 – выравнивание таблицы по центру (margin: 0 auto;) и по правому краю окна браузера (margin-left: auto;).
08:30 – ширина и высота таблиц (width, height).
09:10 – создание рамок (border) для таблицы и для ячеек.
10:00 – свойство CSS «border-collapse», его значения «separate» и «collapse» (разделение и объединение границ смежных ячеек).
10:50 – свойство CSS «border-spacing» для управления расстоянием между ячейками таблицы.
11:50 – задание границ только с одной стороны: border-top, border-bottom, border-left, border-right.
13:00 – задание внутренних отступов в ячейках: padding, padding-top, padding- bottom, padding-left, padding-right.
13:55 – задание ширины (width) и высоты (height) для ячеек таблицы.
14:25 – горизонтальное и вертикальное выравнивание содержимого ячеек таблицы (text-align и vertical-align).
15:30 – использование тега «th» (заглавные ячейки таблицы), их свойства и отличия.
17:03 – использование тега «caption» для создания заголовка таблицы.
17:55 – свойство CSS «caption-side» для изменения положения заголовка таблицы относительно самой таблицы .
18:45 – использование свойства «width: 100%» при задании ширины таблице.
19:22 – задание фонового цвета для ячеек таблицы (свойство background-color).
19:40 – задание цвета текста для содержимого ячеек таблицы (свойство color).
19:55 – задание атрибута «class» для элементов таблицы.
21:00 – использование свойства CSS «empty-cells» для пустых ячеек таблицы, его значения «show» и «hide».
22:40 – объединение ячеек таблицы.
23:40 – горизонтальное объединение ячеек таблицы, атрибут «colspan» для тега «td».
25:10 – вертикальное объединение ячеек таблицы, атрибут «rowspan» для тега «td».
25:59 – горизонтальное и вертикальное объединение ячеек таблицы одновременно.
29:20 – группировка строк таблицы при помощи тегов «tbody», «thead», «tfoot», их назначение, правильное использование и задание им свойств CSS.
![](https://i.ytimg.com/vi/vIDfZH8EppA/maxresdefault.jpg)