靴带中的一侧装订线宽度

Question

如何在Bootstrap 4中实现单面装订线？目前，Bootstrap支持双面装订线。例如

我尝试过以下课程，但不确定这是正确的方法。

 div[class*="col-"] {
   padding-left: 0;
}

Answer 1

您可以尝试实现以下方法：

.content {
  background-color: gray;
  height: 400px;
}

.special-container div:first-child {
  padding-left: 0px;
}

.special-container div:last-child {
  padding-right: 0px;
}

<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet" />
<br><br>
<div class="container">
  <div class="row special-container">
    <div class="col-4">
      <div class="content"></div>
    </div>
    <div class="col-4">
      <div class="content"></div>
    </div>
    <div class="col-4">
      <div class="content"></div>
    </div>
  </div>
</div>

您可以使用媒体查询将其恢复为默认设置，以便为移动设备设置适当的填充。