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>

 

posted @ 2016-03-24 23:15  北极熊爱吃鱼  阅读(167)  评论(0编辑  收藏  举报