Bootstrap的緊湊型表格

2018-09-07 19:39 更新
所謂緊湊型表格,即表格的顯示比普通表格稍微緊湊一些,實現(xiàn)原理是減少單元格的內邊距。使用方式如下:
    <table class="table table-condensed">
        ...
    </table>


運行效果下所示:

Bootstrap的緊湊型表格

默認情況下表格的padding是8像素,緊湊型表格的padding值是5像素。源碼如下:
// 源碼1441行
.table-condensed > thead > tr > th,
.table-condensed > tbody > tr > th,
.table-condensed > tfoot > tr > th,
.table-condensed > thead > tr > td,
.table-condensed > tbody > tr > td,
.table-condensed > tfoot > tr > td {
  padding: 5px;
}


以上4種特效的樣式可以混合在一起使用,從而制作出復雜而精美的表格。

以上內容是否對您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號
微信公眾號

編程獅公眾號