HTML Границы таблицы
HTML таблицы могут иметь границы разных стилей и форм.
Как добавить границу
Когда вы добавляете границу к таблице, вы также добавляете границы вокруг каждой ячейки таблицы:
Чтобы добавить границу, используйте CSS свойство border к таблице table, и элементов th и td:
Свернуть границы таблицы
Чтобы избавиться от двойных границ, как в приведенном выше примере, задайте для CSS свойства border-collapse значение collapse.
Это заставит границы слиться в единую границу:
Стилизация границ таблицы
Если вы установите цвет фона для каждой ячейки и зададите границе белый цвет (такой же, как фон документа), вы получите эффект невидимой границы:
Пример
table, th, td {
border: 1px solid white;
border-collapse: collapse;
}
th, td {
background-color: #96D4D4;
}
Попробуйте сами »
Закругленные границы таблицы
С помощью CSS свойства border-radius границы таблицы получают закругленные углы:
Чем больше указано значение в пикселях, тем больше будет эффект закругления.
Пропустите границу возле таблицы, выключив table в селекторе CSS:
Пунктирные границы таблицы
С помощью CSS свойства border-style можно настроить внешний вид границы.
Допускаются следующие значения:
dotteddashedsoliddoublegrooveridgeinsetoutsetnonehidden
Цвет границы
С помощью CSS свойства border-color вы можете установить цвет границы.
