CSS Twitter-bootstrap 表如何只获取外边界线而不是行之间
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/12411334/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Twitter-bootstrap table how to get only the outer border lines and not in between rows
提问by snowleopard
I have
我有
<table class="table table-condensed">
I used to have table-borderedin there but it is giving me the lines in between rows. I just want the top, bottom, left and right lines on the outside of the entire table and no lines in between rows.
我曾经table-bordered在那里，但它给了我行之间的线条。我只想要整个表格外侧的顶部、底部、左侧和右侧线，行之间没有线。
Also, I tried to do baby steps first and therefore tried to remove the lines in between rows as suggested here Remove row lines in twitter bootstrapand the solution given
此外，我尝试先执行婴儿步骤，因此尝试按照此处的建议删除行之间的行 Remove row lines in twitter bootstrap和给出的解决方案
table td {
border-top: none;
}
didn't work for me
对我不起作用
回答by hajpoj
I believe your CSS isn't getting picked up because it isn't specific enough. the css that defines the border in the twitter bootstrap code is:
我相信你的 CSS 没有被接受，因为它不够具体。在 twitter 引导代码中定义边框的 css 是：
.table th, .table td { /*css*/ }
but your code is
但你的代码是
table td { /* css */}
the first is considered more specific because it uses the class ".table" instead of the table element as the selector and thus has higher priority.
第一个被认为更具体，因为它使用类“.table”而不是 table 元素作为选择器，因此具有更高的优先级。
Made a small jsfiddle to do what you want http://jsfiddle.net/hajpoj/EfUAa/11/
做了一个小的 jsfiddle 来做你想做的http://jsfiddle.net/hajpoj/EfUAa/11/
.table td, .table th {
border: none;
}
table.table.table-condensed {
border: 1px solid black;
}
Here's a good resource on css specificity:
这是一个关于 css 特异性的好资源：
http://coding.smashingmagazine.com/2007/07/27/css-specificity-things-you-should-know/
http://coding.smashingmagazine.com/2007/07/27/css-specificity-things-you-should-know/
Also make sure that your css file is loaded after the bootstrap file.
还要确保您的 css 文件在引导文件之后加载。
回答by Smit Kamal
You can add the following to your CSS style:
您可以将以下内容添加到您的 CSS 样式中：
<style>
.table{
outline-style: solid;
outline-width: 2px;
</style>
Hope it helps. More on "outline-style":https://www.w3schools.com/cssref/pr_outline-style.asp.
希望能帮助到你。更多关于“大纲样式”的信息：https: //www.w3schools.com/cssref/pr_outline-style.asp。
