HTML Таблиці. Padding & Spacing
Таблиці HTML можуть регулювати відступи всередині чарунок (комірок), а також відстань між чарунками (комірками).
hello | hello | hello |
hello | hello | hello |
hello | hello | hello |
hello | hello | hello |
hello | hello | hello |
hello | hello | hello |
HTML Таблиця - Cell Padding
Cell Padding (відступи чарунок) – це простір між краями чарунок і змістом чарунки.
За замовчуванням для заповнення встановлено значення 0.
Щоб додати відступи до чарунок таблиці, використовуйте CSS властивість padding
:
Щоб додати відступ лише над змістом (тобто, вгорі), використовуйте властивість padding-top
.
Також інші сторони за допомогою властивостей padding-bottom
(внизу), padding-left
(ліворуч) і padding-right
(праворуч):
Приклад
th, td {
padding-top: 10px;
padding-bottom: 20px;
padding-left: 30px;
padding-right: 40px;
}
Спробуйте самі »
HTML Таблиця - Cell Spacing
Cell spacing - це відстань між чарунками.
За замовчуванням відстань складає 2 пікселі.
Щоб змінити відстань між чарунками таблиці, використовуйте CSS властивість border-spacing
на елементі table
:
Примітка. Щоб краще запам’ятати дані CSS-властивості, іноді україномовні веброзробники властивість padding називають"внутрішній відступ", а властивість border-spacing називають "відступ меж".