0
境界線付きのブートストラップ3テーブルを使用したいと思います。たとえば、class="table table-bordered"
を使用して、セル間に境界線を作成します。表の外側。ブートストラップ3外枠なしで表の境界になっています
私は次のように試してみましたが、それは両側でうまくいくようですが、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ソリューションがありますか?