НАЙКРАЩИЙ САЙТ ДЛЯ ВЕБ-РОЗРОБНИКІВ
HTML5. Уроки для початківців. W3Schools українською

En Es De Fr

HTML Таблиці. Padding & Spacing


Таблиці HTML можуть регулювати відступи всередині чарунок (комірок), а також відстань між чарунками (комірками).


За допомогою Padding
hello hello hello
hello hello hello
hello hello hello
За допомогою Spacing
hello hello hello
hello hello hello
hello hello hello

HTML Таблиця - Cell Padding

Cell Padding (відступи чарунок) – це простір між краями чарунок і змістом чарунки.

За замовчуванням для заповнення встановлено значення 0.

Щоб додати відступи до чарунок таблиці, використовуйте CSS властивість padding:

Приклад

th, td {
  padding: 15px;
}
Спробуйте самі »

Щоб додати відступ лише над змістом (тобто, вгорі), використовуйте властивість 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:

Приклад

table {
  border-spacing: 30px;
}
Спробуйте самі »

Примітка. Щоб краще запам’ятати дані CSS-властивості, іноді україномовні веброзробники властивість padding називають"внутрішній відступ", а властивість border-spacing називають "відступ меж".



Коментарі