删除twitter bootstrap中的行行

w00*_*00t 72 css css3 twitter-bootstrap

我正在使用twitter引导程序来执行一些我不得不做的Web应用程序(我不是Web开发人员)而且我找不到禁用表行行的方法.

Bootstrap文档中可以看出,默认表格样式包含行行.

问候,

And*_*ich 123

将其添加到您的主CSS:

table td {
    border-top: none !important;
}
Run Code Online (Sandbox Code Playgroud)

用于较新版本的bootstrap:

.table th, .table td { 
     border-top: none !important; 
 }
Run Code Online (Sandbox Code Playgroud)

  • 不要全局覆盖这样的样式.使用新的CSS类,而不是覆盖所有表的默认值.```.table-borderless td,.table-borderless th {border:0; 来自http://coderwall.com/p/hfurca的``` (47认同)
  • @AndresIlich - 右 - 引导程序为所有表设置默认样式.我贬低了,因为在全球范围覆盖是一个坏主意.您将对应该有边框的表造成意外后果. (5认同)
  • @AndresIlich我认为PeterDavis试图说的不是覆盖全局样式,而是应该在他所针对的表格中添加无边界类,并相应地设计样式.我认为dex412的答案完全表达了他的意思.不要理解为什么你坚持认为重写全局变量是唯一的解决方案. (4认同)
  • @MartinWickman这个答案是为早期版本的bootstrap编写的(当时有一点点)所以这个方法需要`!important`规则才能工作,但是你可以通过使选择器更加具体来规避: `.table th,.table td {border-top:none; }` (3认同)

小智 51

在Bootstrap 3中,我添加了一个table-no-border类

.table-no-border>thead>tr>th, 
.table-no-border>tbody>tr>th, 
.table-no-border>tfoot>tr>th, 
.table-no-border>thead>tr>td, 
.table-no-border>tbody>tr>td, 
.table-no-border>tfoot>tr>td {
  border-top: none; 
}
Run Code Online (Sandbox Code Playgroud)

  • 这有效.应该是IMO的最佳答案. (5认同)
  • 这个解决方案对我有用,而其他人没有(包括解决方案[这里](http://stackoverflow.com/questions/18075794/bootstrap-table-without-stripe-borders)).在Rails中通过`bootstrap-sass`使用Bootstrap 3. (4认同)

Spi*_*dle 15

如果你只使用.table td,bootstrap.min.css比你自己的样式表更具体.所以请改用:

.table>tbody>tr>th, .table>tbody>tr>td {
    border-top: none;
}
Run Code Online (Sandbox Code Playgroud)