工作室注册登录标签云赞助光荣榜

当前位置:首页 > 全栈分享 > phpcms > 正文

phpcms如何修改分页的样式

发布时间:2018-03-04 22:57:58作者:魏义齐阅读:()评论:

本文为博主原创文章,未经博主允许不得转载。

方法有两个,一个是自定义,一个是利用phpcms本身自带的分页样式。

自定义列表分页样式的修改请看这篇文章:http://blog.sina.com.cn/s/blog_46444bac01016475.html

利用本身自带的分页样式:这是我在做搜索功能时意外发现的。

大家都知道直接调用{$pages},出来的分页样式是最初始化的,而我们想写样式去操控它却发现没有能被操控的元素。我的博客上线之后分页样式一直很low,有人也建议我修改下分页的样式,但是自定义再修改样式很麻烦,所以一直搁置,后来给博客做搜索,意外的发现搜索列表页的样式还不错,于是就把代码复制粘贴过来用了。方法如下:

分页代码外面的盒子一定要加上id="pages"

然后找到默认模板里的search模块,因为样式引入文件在头部里,所以直接打开header.html就可以找到搜索列表页的样式

打开statics/css/search.css,直接搜索pages,对,就是下面这段:

  1. /* pages */ 
  2. #pages { 
  3.     padding14px 0 10px
  4.     font-family: 瀹嬩綋; 
  5.     margin10px
  6. #pages a { 
  7.     display: inline-block
  8.     width26px
  9.     height22px
  10.     line-height22px
  11.     background#fff
  12.     border1px solid #e3e3e3
  13.     text-aligncenter
  14.     color#333 
  15. #pages a.a1 { 
  16.     backgroundurl(../images/search/admin_img/pages.png) no-repeat 0 5px
  17.     width56px
  18. #pages a:hover { 
  19.     background#f1f1f1
  20.     color#000
  21.     text-decorationnone
  22. #pages span { 
  23.     display: inline-block
  24.     width26px
  25.     height22px
  26.     line-height22px
  27.     background#5a85b2
  28.     border1px solid #5a85b2
  29.     color#fff
  30.     text-aligncenter
  31. .page .noPage { 
  32.     display: inline-block
  33.     width56px
  34.     height22px
  35.     line-height22px
  36.     backgroundurl(../img/icu/titleBg.png) repeat-x 0 -55px
  37.     border1px solid #e3e3e3
  38.     text-aligncenter
  39.     color#a4a4a4

把这段代码复制到自己模板对应的样式里面,不要管它是什么东西,OK,我们可以看到样式还是不错的(分页出现的前提是列表页的num值)。如果你一定要自己写样式,就用上面第一种方法慢慢研究吧!

本文标签:,您可以阅读与「」相关的所有文章

魏义齐全栈技术交流:魏义齐全栈技术交流

上一篇:phpcms如何将文章编辑器的超链接目标窗口改为默认新窗口下一篇:phpcms后台登录界面和管理中心的标题和版权修改

原创不易,您的赞助就是博主更新的动力!

赞助请备注,8.88元及以上可在赞助光荣榜留下外链信息。

HashOver畅言云评完全自托管的评论系统

工作室注册登录标签云赞助光荣榜

最新会员
  • 东方星雨
  • deanhan
  • 1264822519
  • aini3311
  • a1051020101
  • weiyiqi