这种分页效果简洁明了，适合博客站和咨询站等网站使用
01 <!-- 分页 -->
02 {pboot:if({page:rows}>0)}
03 <div class="pagebar">
04 <div class="pagination">
05 <a class="page-item page-link hidden-sm" href="{page:index}" title="首页">首页</a>
06 <a class="page-item page-link" href="{page:pre}" title="上一页">上一页</a>
07 <a class="page-item page-num-current" href="javascript:;" title="当前页">{page:current}</a>
08 <a class="page-item page-link" href="javascript:;" title="当前页/总页数">{page:current}/{page:count}</a>
09 <a class="page-item page-link" href="{page:next}" title="下一页">下一页</a>
10 <a class="page-item page-link hidden-sm" href="{page:last}" title="尾页">尾页</a>
11 </div>
12 </div>
13 {else}
14 <div class="tac text-secondary">本分类下无任何数据！</div>
15 {/pboot:if}
美化后的分页条效果
01 /* ----- 通用PB分页条 ----- */
02 .pagebar .pagination {
03 display: flex;
04 justify-content: center;
05 margin-top: 10px;
06 }
07 .pagination a {
08 background: #fff;
09 border: 1px solid #ccc;
10 color: #333;
11 font-size: 14px;
12 padding: 6px 8px;
13 margin: 0 2px;
14 border-radius: 3px;
15 }
16 .pagination a:hover {
17 color: #4fc08d;
18 border: 1px solid #4fc08d;
19 }
20 .pagination a.page-num-current {
21 color: #fff;
22 background: #4fc08d;
23 border: 1px solid #4fc08d;
24 }
