Question

我希望使用Bootstrap 3垂直对齐h2-Heading和href-style-button - 我现在已经尝试了一个小时。我该怎么做？这将保持响应......

标题必须在左边对齐，href与右边对齐（这就是我使用右拉类的原因），但两者的文本应该在同一个思想水平线上。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/>

<div class="row">
  <div class="col-md-6">
    <h2><b>Clubnews</b></h2>
  </div>
  <div class="col-md-6">
    <a class="btn btn-sm btn-default pull-right" href="#">
      <i class="fa fa-plus-square"></i> neuer Beitrag
    </a>
  </div>
</div>

Answer 1

完整解决方案：

默认情况下，H2有一些填充，所以为了匹配相等我已经在第二个div中添加了一个样式。

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/>

<div class="row">
  <div class="col-md-6">
    <h2 class="pull-left"><b>Clubnews</b></h2>
  </div>
  <div class="col-md-6"  style="padding: 15px">
    <a class="btn btn-sm btn-default pull-right" href="#">
      <i class="fa fa-plus-square"></i> neuer Beitrag
    </a>
  </div>
</div>

＆＃13;

Bootstrap - 在Bootstrap中对齐标记和H2

1 个答案: