如果你的网页有很多内容，就需要使用分页功能。
创建一个基础的分页功能需要在
-
-
元素上加上 .pagination 类:
实例
"pagination">
- "#">1
- "#">2
- "#">3
- "#">4
- "#">5
当前页面
可以在
- 加上 .current 类来标注当前页面：
实例
-
"pagination">
- "current">"#">1
- "#">2
- "#">3
- "#">4
- "#">5
禁用分页
如果需要设置某个分页不可点击需要使用 .unavailable 类：
实例
-
"pagination">
- "#">1
- "#">2
- "unavailable">"#">3
- "#">4
- "#">5
分页方向
在第一个和最后一个
- 元素上添加.arrow 类插入 HTML 实体符号 « 和 » 来创建分页方向符号：
实例
-
"pagination">
- "arrow">"#">«
- "#">1
- "#">2
- "#">3
- "#">4
- "#">5
- "arrow">"#">»
分页居中显示
我们可以在
-
外层添加
元素，并在
上添加.pagination-centered 类来实现分页居中显示 :
实例
"pagination-centered">-
"pagination">
- "arrow">"#">«
- "current">"#">1
- "#">2
- "#">3
- "#">4
- "#">5
- "arrow">"#">»
面包屑导航
面包屑导航用于展示当前页面的导航结构。
在
-
元素上添加 .breadcrumbs 类来实现面包屑导航。你可以在
- 上添加 .current 或 .unavailable 类设置当前页与不可点击效果:
实例
-
"breadcrumbs">
- "#">Home
- "#">Private
- "unavailable">"#">Pictures
- "current">Vacation
子导航
在页面切换上，子导航是非常有用的。
在
-
元素上添加 .sub-nav 类来创建子导航。在
元素上添加标题，为选中的选项添加 .active 类:
实例
-
"sub-nav">
- Filter:
- "active">"#">All
- "#">Active
- "#">Pending
- "#">Suspended
本文来源：www.lxlinux.net/12180.html，若引用不当，请联系修改。
