Установить внутреннюю границу таблицы в HTML

Question

Как мне установить «внутреннюю границу» - границу между разными ячейками.

Устанавливая атрибуты стиля, мне удается контролировать внешнюю границу, но внутренняя граница остается того же серого цвета и такой же ширины. Какие атрибуты я должен настроить, чтобы контролировать внутреннюю границу?

Answer 1

Для обычной разметки таблиц, вот краткое решение, которое работает на всех устройствах / браузерах в BrowserStack, кроме IE 7 и ниже:

table { border-collapse: collapse; }

td + td,
th + th { border-left: 1px solid; }
tr + tr { border-top: 1px solid; }

Для поддержки IE 7 добавьте:

tr + tr > td,
tr + tr > th { border-top: 1px solid; }

Тестовый пример можно увидеть здесь: http://codepen.io/dalgard/pen/wmcdE

Answer 2

Вам нужно стилизовать элемент <td>.

Взгляните на сайт W3C