GoToWeb - Видеокурс Html и Css, урок 14, Таблицы html, свойства таблиц, объединение ячеек HD

03.11.2016
https://youtu.be/vIDfZH8EppA В видеоуроке демонстрируется создание таблиц в документах 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.

Похожие видео

Показать еще