Question

我在一行上放置了6个字形，并希望将它们组成链接（最终制作成模态）。

这是我的代码，用于在将它们转换为链接之前将它们放在行上：

   <div class="row">
   <div class="col-md-2"><i class="fa fa-windows fa-3x" class="center-block"></i></div>
   <div class="col-md-2"><i class="fa fa-linux fa-3x" class="center-block"></i></div>
   <div class="col-md-2"><i class="fa fa-apple fa-3x" class="center-block"></i></div>
   <div class="col-md-2"><i class="fa fa-android fa-3x" class="center-block"></i></div>
   <div class="col-md-2"><i class="fa fa-bluetooth fa-3x" class="center-block"></i></div>
   <div class="col-md-2"><i class="fa fa-wifi fa-3x" class="center-block"></i></div>
</div>

这很有效。

然后我开始将它们变成链接（尚未完成）：

    <div class="row">
   <div class="col-md-2"><a class="btn btn-link" href="#"><i class="fa fa-windows fa-3x" class="center-block"></i></div>
   <div class="col-md-2"><a class="btn btn-link" href="#"><i class="fa fa-linux fa-3x" class="center-block"></i></div>
   <div class="col-md-2"><a class="btn btn-link" href="#"><i class="fa fa-apple fa-3x" class="center-block"></i></div>
   <div class="col-md-2"><a class="btn btn-link" href="#"><i class="fa fa-android fa-3x" class="center-block"></i></div>
   <div class="col-md-2"><a class="btn btn-link" href="#"><i class="fa fa-bluetooth fa-3x" class="center-block"></i></div>
   <div class="col-md-2"><a class="btn btn-link" href="#"><i class="fa fa-wifi fa-3x" class="center-block"></i></div>
</div>

突然，最后一个WiFi glyphicon与另一个不完全在同一条线上，但它略有下降。

如何让它与其他人处于同一水平？

Answer 1

您可以在关闭a代码时执行此操作。

    <div class="row">
   <div class="col-md-2"><a class="btn btn-link" href="#"><i class="fa fa-windows fa-3x" class="center-block"></i></a></div>
   <div class="col-md-2"><a class="btn btn-link" href="#"><i class="fa fa-linux fa-3x" class="center-block"></i></a></div>
   <div class="col-md-2"><a class="btn btn-link" href="#"><i class="fa fa-apple fa-3x" class="center-block"></i></a></div>
   <div class="col-md-2"><a class="btn btn-link" href="#"><i class="fa fa-android fa-3x" class="center-block"></i></a></div>
   <div class="col-md-2"><a class="btn btn-link" href="#"><i class="fa fa-bluetooth fa-3x" class="center-block"></i></a></div>
     <div class="col-md-2"><a class="btn btn-link" href="#"><i class="fa fa-wifi fa-3x" class="center-block"></i></a></div>
</div>

col-md-2最后一列不在同一行

1 个答案: