zoukankan      html  css  js  c++  java
  • Bootstrap_分页

    一、带页码的分页导航

    <ul class="pagination">
      <li><a href="#">&laquo;</a></li>
      <li><a href="#">1</a></li>
      <li><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="#">&raquo;</a></li>
    </ul>

    二、翻页分页导航

    <ul class="pager">
       <li><a href="#">&laquo;上一页</a></li>
       <li><a href="#">下一页&raquo;</a></li>
    </ul>

      对齐样式设置:

      默认情况之下,翻页分页导航是居中显示,但有的时候我们需要一个居左,一个居右。Bootstrap框架提供了两个样式:

      ☑ previous:让“上一步”按钮居左

      ☑ next:让“下一步”按钮居右

      具体使用的时候,只需要在li标签上添加对应类名即可:

    <ul class="pager">
       <li class="previous"><a href="#">&laquo;上一页</a></li>
       <li class="next"><a href="#">下一页&raquo;</a></li>
    </ul>
  • 相关阅读:
    Django 【第十二篇】Form组件进阶
    Django 【第十一篇】Form组件基础
    前端知识点总结
    vue组件续和前端工程化
    vue组件
    Vue视图下
    Vue实例与渲染
    BootStrap
    jQuery事件与动画
    dom操作 属性操作 样式操作
  • 原文地址:https://www.cnblogs.com/Ryan344453696/p/4996328.html
Copyright © 2011-2022 走看看