css властивість border-spacing
Властивість border-spacing
задає відстань між кордонами сусідніх комірок (тільки для моделі separated borders
). Це не працюватиме в разі, коли для таблиці встановлено властивість border-collapse
із значенням collapse
.
Без задання в таблиці HTML використовується "розділена гранична модель". Це дає певний ефект "подвійного кордону", коли між границями кожної клітинки є пробіл, а також краю таблиці (якщо у вас також є межа елемента таблиці).
Значення border-spacing
також використовується уздовж зовнішнього краю таблиці, де відстань між межами таблиці та комірок у першому / останньому стовпчику або рядку є сумою відповідного (горизонтального або вертикального) border-spacing
, а також відповіднього (верхній, правий, нижній або лівий) поля (padding
).
Нотатка: | Властивість |
Синтаксис
border-spacing: length|initial|inherit;
Властивість border-spacing може отримувати 3 значення:
Значення без задання: | 0 |
---|---|
Наслідує: | Так |
Анімується: | Ні |
JavaScript синтаксис: | object.style.borderSpacing="15px" |
Переглядачі
Переглядач | ||||||
---|---|---|---|---|---|---|
border-spacing | 1.0 |
8.0 |
1.0 |
1.0 |
4.0 |
12.0 |
Переглядач | |||
---|---|---|---|
border-spacing | 1.0 |
1.0 |
1.0 |
Мобільних переглядачів ще не додано.
Приклади
Динамічний приклад
Приклад використання властивості
Встановлення відстані між границями сусідніх комірок
table {
border-collapse: separate;
border-spacing: 10px 50px;
}