Я хочу использовать таблицу загрузок 3 с границами, например, с помощью class="table table-bordered"
, так что у меня будут границы между ячейками, но Я не хочу никаких границ на внешней стороне таблицы.bootstrap3 с таблицей без границ
Я пробовал следующее, и, похоже, он хорошо работает для сторон, но я не могу придумать хороший способ обработки потенциальных верхних и нижних границ, учитывая, что thead
и tfoot
являются дополнительными элементами. Я надеялся сделать что-то надежное, что будет учитывать эти сценарии, максимизируя потенциал возобновления.
.table-bordered.no-outside-borders {
border: none;
}
.table-bordered.no-outside-borders>thead>tr>td:first-child,
.table-bordered.no-outside-borders>thead>tr>th:first-child,
.table-bordered.no-outside-borders>tfoot>tr>td:first-child,
.table-bordered.no-outside-borders>tfoot>tr>td:first-child,
.table-bordered.no-outside-borders>tbody>tr>td:first-child,
.table-bordered.no-outside-borders>tbody>tr>th:first-child {
border-left: none;
}
.table-bordered.no-outside-borders>thead>tr>td:last-child,
.table-bordered.no-outside-borders>thead>tr>th:last-child,
.table-bordered.no-outside-borders>tfoot>tr>td:last-child,
.table-bordered.no-outside-borders>tfoot>tr>th:last-child,
.table-bordered.no-outside-borders>tbody>tr>td:last-child,
.table-bordered.no-outside-borders>tbody>tr>th:last-child {
border-right: none;
}
Есть ли здесь хорошее решение css?