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

En Es De

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 називають "відступ меж".



Коментарі