Pbootcms自定义分页样式,适用于多种环境

塔夏时光

已于 2022-01-22 11:28:34 修改

阅读量4.2k

点赞数 1

分类专栏： pbootcms 文章标签： css 前端

于 2021-05-28 09:21:38 首次发布

本文链接：https://blog.csdn.net/iepldn/article/details/117351348

版权

本文介绍了如何在PbootCMS中自定义分页样式，以适应不同的网站需求。通过系统自带的分页标签和CSS样式，可以实现个性化设计。文章提供了实例代码，包括独立的分页元素和数字条分页样式，强调熟悉和自由组合PbootCMS的标签以达成更多效果。同时，注意在实际使用中需删除标签中的@符号。

摘要由CSDN通过智能技术生成

系统自带分页效果

pbootcms 程序自带的分页样式为： {page:bar} ，时间长了发现难以满足不同网站仿制时分页的要求，系统自带标签如下，可以灵活搭配使用；

{page:bar}	系统内置的完整分页条
{page:current}	当前页码
{page:count}	总页数
{page:rows}	总数据行数
{page:index}	首页链接
{page:pre}	前一页链接
{page:next}	下一页链接
{page:last}	尾页链接
{page:status}	分页状态信息
{page:numbar}	数字条,数字带class名称为page-num，当前的同时还带page-num-current
{page:selectbar}	下拉选择条

可以在系统的样式基础上，自己再加点CSS效果美化下；

/* 分页样式 */

.paging { margin-top: 32px; font-size: 14px; }

.paging > span { margin: auto 16px; }

.paging .page-numbar { margin: auto 0; }

.paging .page-numbar .page-num,

.paging .page-index,

.paging