时间戳

首页 > 解决方案 > Bootstrap 4 水平列表组刷新

bootstrap-4 - Bootstrap 4 水平列表组刷新

问题描述

如果将“list-group-flush”类添加到水平列表组，则最后一个子项（li）没有边框底部。它不应该被视为 Bootstrap 4 的错误吗？此外，还存在一些预期之外的边界半径。 

<!DOCTYPE html>
<html lang="en">
<head>
  <title>Bootstrap Example</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
  
</head>
<body>

<div class="container">
  <h2>Horizontal List Groups</h2>
 
  <ul class="list-group list-group-horizontal list-group-flush">
    <li class="list-group-item">First item</li>
    <li class="list-group-item">Second item</li>
    <li class="list-group-item">Third item</li>
    <li class="list-group-item">Fourth item</li>
  </ul>
</div>

</body>
</html>

标签： bootstrap-4

解决方案

这不是引导错误，因为 list-group-flush

list-group-flush 删除一些边框和圆角以在父容器中边对边呈现列表组项目

您可以通过将样式应用于列表项的最后一个子项来将边框添加到最后一个

推荐阅读