[学习笔记] bootstrap(七): 分页

最新推荐文章于 2024-10-08 09:00:00 发布

7圈电池

最新推荐文章于 2024-10-08 09:00:00 发布

阅读量616

点赞数

CC 4.0 BY-SA版权

分类专栏：学习笔记文章标签： bootstrap 分页

本文链接：https://blog.youkuaiyun.com/guddqs/article/details/53995167

学习笔记专栏收录该内容

14 篇文章

订阅专栏

本文介绍了一种分页组件的状态展示方式，包括当前页、不可用页及前后页的导航按钮实现，适用于网页应用中数据分页显示的需求。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

分页页数状态

<ul class="pagination">
    <li> <a href="#"> &laquo; </a> <li>
    <li class="active"> <a href="#"> 1 </a> </li>
    <li> <a href="#"> 2 </a> </li>
    <li class="disabled"> <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 class="previous"> <a href="#" > 首页 </a> </li>   
    <li class="previous"> <a href="#" > 上一页 </a> </li>
    <li class="next"> <a href="#" > 尾页 </a> </li>   
    <li class="next"> <a href="#" > 下一页 </a> </li>
</ul>