【问题标题】：Weird Bootstrap bugs (table and navbar)奇怪的引导程序错误（表格和导航栏）
【发布时间】：2013-09-01 20:26:23
【问题描述】：

表格错误已修复：我丢失了 thead 和 tbody 标签！

我对 Bootstrap 有一个奇怪的问题。一切都很好，但是当我尝试使用 table-hover 类时它就不起作用了。另外，表格有上边框：http://gyazo.com/796c5bb99058c0d07e8ece8f54790399.png

另外，当我调整 Chrome 浏览器的大小时，导航栏看起来像这样： http://gyazo.com/cb7842b71d7a6e63eb0d5ce3f0b52902.png 而不是 getbootstrap.com 网站上正常的“移动”外观。

我正在使用：

<!DOCTYPE html>
<html lang="en">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/bootstrap-responsive.min.css" rel="stylesheet">

代码：

<table id='keytable' class='table table-hover'>
<tr><th>sv_licensenum</th><th>Type</th><th>Key</th><th>Description<‌/th></tr>
<tr><td>0</td><td>Ranked</td><td>alrCOdo8PsFUur6iZmIlESd7</td><td>test2<‌/td></tr>
<tr><td>1</td><td>Ranked</td><td>VLnNg25kSZRB4IzNpufu0qIs</td><td>test45‌6</td></tr>
</table>

id="keytable" 未在任何外部非引导 CSS 文件/代码中指定。它仅用于 Javascript。

【问题讨论】：

标签： css twitter-bootstrap html-table border

【解决方案1】：

仔细检查文件后，我找到了这种奇怪行为的原因。

您需要删除您在 html 中定义的样式。这就是当您达到 979 像素或更少时导航栏获得填充的原因。你可以考虑通过@media 或者 media-query 来定义这个

body {
    padding-top: 60px; 
    background-color: #f5f5f5;
}

然后你必须删除样式

nav-collapse collapse

这将隐藏您放入其中的任何内容。

阅读http://getbootstrap.com/2.3.2/components.html#navbar

希望这能解决您的问题。

【讨论】：

如果负面标记附带对问题的解释，那么了解限制会有所帮助。

【解决方案2】：

我希望您还包含了所需的引导 js 文件。我在测试您提供的代码时没有遇到任何问题。

【讨论】：

我有：、
如果你分享你的代码会很有帮助。或可以复制问题的缩小版本。
确实如此。附加在 bootstap-responsive.min.css 上的媒体查询正在发生这种情况。当宽度低于 980 像素时，整个导航栏正在发生变化。建议：将 responsive.min 更改为 responsive.css 以进行调试。您可以在开发者控制台中检查更改。然后根据需要应用/覆盖样式。将对此进行进一步调查。
还有桌子？ @pallab
我认为您可以通过覆盖 bootstarp 定义的样式来摆脱这种情况。只需创建一个自定义 css 并在包含 bootstarp 后包含。您需要更改此样式.table th, .table td { border-top: 0 }