0

我一直在尝试让 .list-group 和 .list-group-item 在我的 Minecraft 管理面板上的 .panel 中创建玩家列表,但是在面板和 .panel 之间似乎总是有一些神秘的填充。 Bootstrap 网站上不存在的列表组。

我实际上是在一个小时左右前下载了我的 Bootstrap 文件,所以它们绝对是最新的版本,并且从那以后文档没有改变。

这是我在 Bootstrap 网站上看到的内容:http: //getbootstrap.com/components/#panels-list-group 在此处输入图像描述

这是他们提供但呈现在我的网站上的完全相同的代码:(我还使用查看源代码来验证他们在呈现页面上显示的实际格式化代码中没有犯一些错误) 在此处输入图像描述

谁能提供任何关于为什么会出错的见解?所有代码都在引导网站上,但我将在此处提供我的整个页面以方便使用:

<!DOCTYPE html>
<html>
<head>
    <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
    <link href="css/bootstrap.min.css" rel="stylesheet"/>
    <link href="css/bootstrap-glyphicons.css" rel="stylesheet"/>
    <script src="js/bootstrap.min.js"></script>
</head>
<body>
    <div class="panel">
    <!-- Default panel contents -->
    <div class="panel-heading">Panel heading</div>
    <p>...</p>

    <!-- List group -->
    <ul class="list-group">
    <li class="list-group-item">Cras justo odio</li>
    <li class="list-group-item">Dapibus ac facilisis in</li>
    <li class="list-group-item">Morbi leo risus</li>
    <li class="list-group-item">Porta ac consectetur ac</li>
    <li class="list-group-item">Vestibulum at eros</li>
    </ul>
    </div>
</body>
</html>

如果我遗漏了任何内容,请发表评论,我会尽快修改我的问题。我知道这可能是一个非常愚蠢的错误,但它让我上当了,我已经搞砸了将近 3/4 小时,希望也许其他人有这个问题并弄清楚发生了什么以及为什么这段代码在引导文档网站。

4

1 回答 1

2

我认为这可能是一个错误。前几天我也知道了。这是我的修复。

.panel .list-group {
  margin: -16px -15px -10px;
}

.panel .list-group .list-group-item {
  border-width: 1px 0;
}

.panel .list-group .list-group-item:first-child {
  border-top-right-radius: 0;
  border-top-left-radius: 0;
}

.panel .list-group .list-group-item:last-child {
  border-bottom: 0;
}
于 2013-08-08T15:21:43.823 回答