【问题标题】:Select and pagination object to form group in Bootstrap在 Bootstrap 中选择和分页对象以形成组
【发布时间】:2016-06-11 01:01:48
【问题描述】:

我尝试将选择和分页组合到一个表单组中,但分页放在底部,而不是右侧。我该如何解决这个问题?

<div class="input-group">
<select class="form-control input-group-addon">
    <option>Egy</option>
    <option>Kettő</option>
    <option>Három</option>
</select>
<ul class="pagination">
    <li><a href="#" aria-label="Previous"><span aria-hidden="true">&laquo;</span></a></li>
    <li><a href="#">1</a></li>
    <li class="active"><a href="#">2</a></li>
    <li><a href="#">3</a></li>
    <li><a href="#">4</a></li>
    <li><a href="#">5</a></li>
    <li><a href="#" aria-label="Next"><span aria-hidden="true">&raquo;</span></a></li>
</ul>
</div>

JSFiddle

【问题讨论】:

    标签: twitter-bootstrap select pagination


    【解决方案1】:

    也许可以尝试不分页并使用常规按钮:

    <div class="input-group">
      <select class="form-control input-group-addon">
            <option>Egy</option>
            <option>Kettő</option>
            <option>Három</option>
        </select>
      <div class="input-group-btn">
        <button class="btn btn-default">1</button>
        <button class="btn btn-default">2</button>
        <button class="btn btn-default">3</button>
        <button class="btn btn-default">4</button>
        <button class="btn btn-default">5</button>
        <button class="btn btn-default">6</button>
      </div>
    </div>
    

    http://www.bootply.com/xPUlqlg3LK

    【讨论】:

      猜你喜欢
      • 2020-07-03
      • 2021-09-18
      • 2016-05-15
      • 2018-07-05
      • 2010-12-31
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多