Question

我试图将页面分为两部分，即6 + 6列，并在每个部分中水平放置3个div。超过3个的Divs对齐在页面同一部分的底行。

我正在尝试，但仍然无法正确对齐。这是我的代码。我该怎么办？

<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
<div class="row" id="meta-search">

  <div class="col-sm-6">
    <h5> IDs </h5>
    <form action="" method="post">

      <div class="col-sm-2 mb-3">
        <label>ID1</label>
        <input type="number" class="form-control">
      </div>

      <div class="col-sm-2 mb-3">
        <label>ID2</label>
        <input type="number" class="form-control">
      </div>

      <div class="col-sm-2 mb-3">
        <label>ID3</label>
        <input type="number" class="form-control">
      </div>

      <button class="btn btn-primary btn-sm" name="submit1" type="submit">Search Record</button>

    </form>
  </div>

</div>

Answer 1

您在标记内缺少另一个。只需添加

  <form action="" method="post"> 
   <div class="row">

Answer 2

bootstrap中的类router.get('/', function (req, res, next) { zone_plz.findAll({ include: [{ model: PLZ, as: 'plz' }, { model: Zone, as: 'zone' }] }).then((result) => { res.send({status: true, data: result}) }).catch(function (err) { next(err) }) });是这样做的，您需要为其添加一个col类div，在您放置row div的行中，bootstrap根据以下内容相应地计算宽度您在col格内输入的列数。

row

如何使用Bootstrap在一行中水平对齐div

2 个答案: