如何使用引導創建無邊界表

我只是想簡單地對齊一些文本和跨度。所以我製作了一張桌子，認爲我可以以某種方式告訴代碼不要畫任何線條。如何使用引導創建無邊界表

這裏是我的示例表：

 <table class="table"> 
      <tbody id="checkbox_list"> 
     <tr style='border:none' > 
      <td style='border:none' > Something <td> 
      <td style='border:none' > <span class="label label-default" style="background-color:#000000;width:35px;height:20px;display:inline-block;"><td> 
     </tr> 
     <tr style='border:none' > 
      <td style='border:none' > Something <td> 
      <td style='border:none' > <span class="label label-default" style="background-color:#000000;width:35px;height:20px;display:inline-block;"><td> 
     </tr>   
      </tbody> 
     </table>

這就是它顯示我

enter image description here

反正我可以擺脫那些討厭的行除了黑盒子？

來源

2015-06-11 aarelovich

沒有'td'在上面的HTML – Tushar

關閉你就不能使用'borderless'類''

元素？而且你還需要關閉你的''。 – Peter

事情是這個問題。謝謝！！！ – aarelovich

回答

正確關閉TD。使用下面的CSS來解決你的問題。

.table tr, .table td { 
    border: none; 
}

來源

2015-06-11 11:42:47 jrath

Bootstrap在表格中添加了一些邊框。添加到您的自定義CSS：

CSS

.table > tbody > tr > td, .table > tbody > tr > th, .table > tfoot > tr > td, .table > tfoot > tr > th, .table > thead > tr > td, .table > thead > tr > th { 
    border: none; 
}

DEMO HERE

這個CSS必須percede引導CSS

來源

2015-06-11 10:16:15

試試這個：

.table > tbody > tr > td{ 
    border: none; 
}

Demo

來源

2015-06-11 10:17:13

嘗試這樣的：Demo

.table.no-border tr td, .table.no-border tr th { 
    border-width: 0; 
}

HTML：

<table class="table no-border"> 
      <tbody id="checkbox_list"> 
     <tr> 
      <td> ... <td> 
      <td > ... <td> 
     </tr> 
     <tr> 
      <td > .. <td> 
      <td > .. <td> 
     </tr>   
      </tbody> 
     </table>

來源

2015-06-11 10:21:42

相關問題