bootstrap3表格邊界沒有外部邊界

Question

我想使用帶邊框的引導程序3表格，例如使用class="table table-bordered"，這樣我會在單元格之間有邊框，但是我不希望表格外部有任何邊框。

我嘗試了以下方法，並且它似乎適用於兩側，但考慮到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解決方案嗎？

Answer 1

昨天我有同樣的問題，我用這個CSS代碼爲：

.table-borderless tbody tr td, .table-borderless tbody tr th, .table-borderless thead tr th { 
    border: none; 
    max-height: 200px; 
    font-size: 20px; 

    border-right: 1px solid gray; 
    border-collapse: collapse; 
} 
.table.table-borderless { 


    border-right: 1px solid gray; 
    border-collapse: collapse; 
    max-height: 200px; 
    font-size: 20px; 
}