CSS Twitter Bootstrap 删除带有行条纹的表格行突出显示
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/10763166/
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 remove table row highlight with row stripes
提问by Adam Levitt
Is there a simple way to remove the tr:hover style from twitter bootstrap such that I can still use their table styling without getting the row highlight on hover?
有没有一种简单的方法可以从 twitter 引导程序中删除 tr:hover 样式，这样我仍然可以使用他们的表格样式而不会在悬停时突出显示行？
回答by mg1075
@Blender's answer is right on, but only if you are notusing the .table-stripedclass on your table.
@Blender 的答案是正确的，但前提是您没有.table-striped在桌子上使用该课程。
If you areusing the .table-stripedclass, the row highlight will not go away when you hover over a row that has the light-grey colored stripe.
如果您正在使用.table-striped该类，当您将鼠标悬停在具有浅灰色条纹的行上时，行突出显示不会消失。
What will happen when you hover over the light-grey row is that the row will change from light-grey to transparent (white), and thus you will be inadvertently implementing a row-hover effect on all the light-grey colored rows.
当您将鼠标悬停在浅灰色行上时会发生什么情况，该行将从浅灰色变为透明（白色），因此您将在不经意间对所有浅灰色行实施行悬停效果。
If you need to take away the hover effect from the striped rows as well, then building upon Blender's original answer, I think you would have another rule to over-ride:
如果您还需要从条纹行中去除悬停效果，那么基于 Blender 的原始答案，我认为您将有另一个规则可以超越：
.table tbody tr:hover td,
.table tbody tr:hover th {
background-color: transparent;
}
.table-striped tbody tr:nth-child(odd):hover td {
background-color: #F9F9F9;
}
good example: Here's a link to a working jsfiddle example where the .table-striped class is accounted for: http://jsfiddle.net/pXWjq/
很好的例子：这是一个工作 jsfiddle 示例的链接，其中考虑了 .table-striped 类：http: //jsfiddle.net/pXWjq/
buggy example: And here's an example where the table row hover still happens (on the grey rows) because the grey-row hover is not accounted for: http://jsfiddle.net/448Rb/
错误示例：这是一个示例，其中表格行悬停仍然发生（在灰色行上），因为不考虑灰色行悬停：http: //jsfiddle.net/448Rb/
?
?
回答by Blender
Override these rules:
覆盖这些规则：
.table tbody tr:hover td,
.table tbody tr:hover th {
background-color: #f5f5f5;
}
Using this:
使用这个：
.table tbody tr:hover td,
.table tbody tr:hover th {
background-color: transparent;
}
