Здравствуйте! От стилизации списков плавно переходим к заданиям стилей для таблиц. В этом уроке мы рассмотрим стили для таблиц.
CSS предоставляет ряд свойств, которые помогают стилизовать таблицу:
-
border-collapse: устанавливает, как будет стилизоваться граница смежных ячеек
-
border-spacing: устанавливает промежутки между границами смежных ячеек
-
caption-side: устанавливает положение элемента caption
-
empty-cells: задает режим отрисовки для пустых ячеек
-
table-layout: определяет размеры таблицы
Установка таблицы
Ранее для установки границы в таблице широко использовался атрибут border, например:
<table border="2px" >
Сейчас же тенденция для стилизации использовать только стили CSS, поэтому граница также задается через CSS с помощью стандартного свойства border:
table {
border: 1px solid #ccc; /* граница всей таблицы */
}
tr {
border: 1px solid #ccc; /* границы между строками */
}
td, th {
border: 1px solid #ccc; /* границы между столбцами */
}
При установке границ между столбцами с помощью свойства border-collapse можно установить общую или раздельную границу между смежными ячейками:
-
collapse: смежные ячейки имеют общую границу
-
separate: смежные ячейки имеют отдельные границы, которые разделяются пространством
Вступите в группу, и вы сможете просматривать изображения в полном размере
Это интересно
0
|
|||
Последние откомментированные темы:
-
Обзор смартфона LG Optimus L9
(1)
hobert
,
01.03.2022
-
Антивирусные приложения Android для защиты устройства
(1)
Наталья_ласточка
,
27.02.2022
-
Как отключить уведомления от Сбербанк за 60 рублей через приложение Сбербанк онлайн и ещё 5 методов!
(1)
bbob
,
15.02.2022
-
Обходим блокировку сайтов.
(3)
Евгений_к
,
07.02.2022
-
Как можно зарабатывать онлайн без вложений
(1)
Vasil
,
20.01.2022
-
Как сделать меню пуск Windows 11 как в Windows 10?
(1)
Vasil
,
30.12.2021
-
Самый продвинутый блокировщик рекламы
(2)
Grigori
,
24.12.2021
-
Какие бывают опасные приложения для смартфона в Плей Маркете и App Store?
(1)
Лариотик
,
08.12.2021
20251119155356