一、分页条标签基础信息
| 描述项 |
说明 |
| 适用范围 |
所有执行了分页的页面 |
| 标签作用 |
输出分页代码 |
| 默认样式 |
系统内置完整分页条,支持直接定义 CSS 样式 |
| 自定义方式 |
可根据需求调整 HTML 结构和样式 |
二、分页条标签分类
(1)系统内置分页条标签
| 标签名 |
描述 |
示例值 |
{page:bar} |
系统内置的完整分页条 |
<div class="page-bar">...</div> |
{page:current} |
当前页码 |
3 |
{page:count} |
总页数 |
10 |
{page:rows} |
总数据行数 |
100 |
{page:index} |
首页链接 |
域名/ |
{page:pre} |
前一页链接 |
域名/?page=2 |
{page:next} |
下一页链接 |
域名/?page=4 |
{page:last} |
尾页链接 |
域名/?page=10 |
{page:status} |
分页状态信息 |
共10页,当前第3页 |
{page:numbar} |
数字条,带 page-num 和 page-num-current 类名 |
<a class="page-num page-num-current">3</a> |
{page:selectbar} |
下拉选择条(默认不显示) |
<select>...</select> |
三、分页条自带的样式类名称
(1)分页条样式类说明
| 样式类名称 |
描述 |
示例值 |
page-status |
分页状态信息样式 |
<span class="page-status">共10页,当前第3页</span> |
page-index |
首页链接样式 |
<a class="page-index" href="域名/">首页</a> |
page-pre |
上一页链接样式 |
<a class="page-pre" href="域名/?page=2">上一页</a> |
page-next |
下一页链接样式 |
<a class="page-next" href="域名/?page=4">下一页</a> |
page-last |
尾页链接样式 |
<a class="page-last" href="域名/?page=10">尾页</a> |
page-numbar |
数字条整体容器样式 |
<div class="page-numbar">...</div> |
page-num |
数字条中的数字样式 |
<a class="page-num" href="域名/?page=3">3</a> |
page-num-current |
当前页数字样式 |
<a class="page-num page-num-current">3</a> |
page-select |
下拉选择条样式(默认隐藏) |
<select class="page-select">...</select> |
四、自定义分页条与前端调试
- 自定义方式:如果需要完全自定义分页条,可以自行编写 HTML 结构,并结合系统提供的分页数据标签(如
{page:current}、{page:count} 等)进行输出。
- 前端调试:可以通过浏览器的开发者工具(F12)查看系统生成的分页条 HTML 结构和样式类名称,从而快速定位并调整样式。

标签:
更新时间:2025-12-06 17:22:27
上一篇:pbootcms内页子栏目当前栏目如何实现高亮显示(PbootCMS 内页子栏目当前栏目高亮显示的实现方法)
下一篇:PbootCMS 动态站点地图访问与配置说明
转载请注明原文链接:https://www.muzicopy.com/suibi/25999.html