javascript - 如何使用 Bootstrap 显示没有水平线的列表框

标签 javascript html css twitter-bootstrap

我正在尝试显示其中没有水平线的列表框 通过使用 bootswrap 列表框。

<head>
  <link rel="stylesheet"    href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
</head>

<body>
<div class="container">

  <ul class="list-group">
    <li class="list-group-item">First item</li>
    <li class="list-group-item">Second item</li>
    <li class="list-group-item">Third item</li>
  </ul>
</div>

</body>

但是显示的是横线。

JSFiddle

请让我知道如何显示带外线的列表框。它会像下面的屏幕。

enter image description here

最佳答案

来自 Bootstrap css 文件:

list-group-item {
    position: relative;
    display: block;
    padding: 10px 15px;
    margin-bottom: -1px;
    background-color: #fff;
    border: 1px solid #ddd;
    }

border: 1px solid #ddd 创建您的边框。您可以通过创建自己的 css 文件(或在您的 .html 中)来覆盖它。将它链接到标题中的 Bootstrap css 之后!如果您首先链接它,Bootstrap css 将覆盖您的更改。否则,您也可以将 !important 添加到您的更改中。

在你的 CSS 中:

list-group-item {
    border: 0px;
    }

有关 Bootstrap、css、html、js 等的一切都在 http://www.w3schools.com/ 中得到了很好的记录和解释。 .它很可能会回答您的所有问题!

关于javascript - 如何使用 Bootstrap 显示没有水平线的列表框,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40507415/

相关文章:

javascript - 正则表达式在特定位置添加空格

javascript - 函数不在浏览器 HTML、JavaScript 中发送警报

jquery - 如何在 css 列表中使用 jquery 交换类/id?

javascript - 访问 SVG 节点的属性

javascript - 使用 mongoose 查询嵌套文档

javascript - React Native FlatList : Select all Items and run 'OnPress'

javascript - Bootstrap Accordion 显示点击顶部的内容

javascript - React/CSS - 当宽度为自动时,内容更改后动画按钮宽度调整大小

HTML 表格宽度显示不正确

javascript - 使用现有 SVG 路径遮盖图像