删除 Bootstrap Table 中一个单元格的边框

Question

我只想删除 bootstrap table 中一个单元格的边框。我试过在那个特定的单元格上放置一个 id，并在我的 css 中放置：

#borderless-cell { border: 0; } 

这似乎不起作用。有什么想法吗？

Answer 1

试试这个：

#borderless-cell { border: none!important; } 

Answer 2

Bootstrap 4 具有内置实用程序 类，可能会有所帮助： https://getbootstrap.com/docs/4.0/utilities/borders/

文档中的示例：

<span class="border-0"></span>

您还可以查看用于使 border-0 工作的 CSS 以提示以纯 CSS.

回答您的问题

Answer 3

请使用这个。

改变这个：<table class="table table-hover table-bordered">

为此：<table class="table table-hover">

然后添加这个 css:

.table {
  border: 1px solid #dddddd;
}

但是，如果您想按照自己的方式进行操作，css 是：

.table-bordered > thead > tr > th,
.table-bordered > tbody > tr > th,
.table-bordered > tfoot > tr > th,
.table-bordered > thead > tr > td,
.table-bordered > tbody > tr > td,
.table-bordered > tfoot > tr > td {
  border: 1px solid #dddddd;
  border-right-width:0px;
  border-left-width:0px;
}

演示：http://jsbin.com/IbebIpob/2/edit

Answer 4

#borderless-cell { border: 1px solid Transparent!important; } 

使边框对该特定单元格透明

Answer 5

用透明边框隐藏它

#borderless-cell { border: 10px solid transparent; }