pbootcms模板列表分页代码及样式

今天麦站分享下PBOOTCMS分页样式表和代码,欢迎大家学习参考。

pbootcms分页样式1:

 <div class="pages">

     <div class="pagination">

     {pboot:if({page:rows}>0)}

     <a class="page-item" href="{page:index}">首页</a>

     <a class="page-item"href='{page:pre}'>上一页</a>

    {page:numbar}

     <a class="page-item" href='{page:next}'>下一页</a>

     <a class="page-item" href='{page:last}'>末页</a>

    {/pboot:if}

   </div>

 </div>



/*麦 站 网分页样式*/

.pages{clear:both;padding:20px 0;font-size:14px;text-align:center; overflow:hidden}

.pages .pagination {display:inline-block;margin:0 auto;padding:0}

.pages .pagination .page-item,.pages .pagination .page-num{color:#555; padding: 3px 14px; display:block; border-radius: 2px; border: 1px solid #ddd;float: left;margin: 0 5px;}

.pages .pagination .page-num-current{ background:#12b34a; color:#fff; border:#12b34a 1px solid}

@media only screen and (max-width:768px){

.pages .pagination .page-num {display: none;}

}

 

pbootcms分页样式2:

{pboot:if({page:rows}>0)}

<div class="pages">

<a href="{page:pre}"> << </a>

{page:numbar}

<a href="{page:next}"> >> </a>

<a class="pagecount">{page:current}/{page:count}</a>

</div>

{else}

<div class="text-center my-5 text-secondary">未查询到任何数据!</div>

{/pboot:if}



/*麦 站 网分页样式*/

.pages{padding: 20px 0;width:100%;text-align: center;clear: both;}

.pages a,.pages span{color: #666;padding: 0 15px;margin: 0 3px;display: inline-block;vertical-align: middle;line-height: 34px;background: #f9f9f9;border: 1px solid #f2f2f2;}

.pages a:hover{display:inline-block;color: #fff;background: #dc0b01;border-color: #dc0b01;box-shadow: 0 0 14px rgba(0, 0, 0, .2);}

.pages span{display:inline-block;color: #666;}

.pages a.page-num-current{display:inline-block;color: #fff;background: #dc0b01;border-color: #dc0b01;box-shadow: 0 0 14px rgba(0, 0, 0, .2);}

.text-secondary{text-align: center; padding:10px 0}

 

主题测试文章,只做测试使用。发布者:xiangxiang,转转请注明出处:http://www.poddns.com/338.html

(0)
xiangxiang的头像xiangxiang
上一篇 2024年12月4日
下一篇 2024年12月4日

相关推荐

  • 网站收录优化攻略,关键词搜索策略全解析

    随着互联网的飞速发展,网站已经成为企业展示形象、拓展市场的重要平台,在庞大的网络世界中,如何让自己的网站脱颖而出,吸引更多的潜在客户,成为了许多网站运营者关心的问题,网站收录和关键词搜索是两大关键环节,本文将深入探讨网站收录优化和关键词搜索策略,助您提升网站在搜索引擎中的排名,吸引更多流量。 网站收录优化 1、网站结构优化 (1)清晰合理的导航:网站结构应清…

    2025年5月7日
    00
  • 5步解决网站收录难题,让搜索引擎快速抓取你的内容!

    随着互联网的快速发展,越来越多的企业和个人开始建立自己的网站,如何让网站在搜索引擎中快速收录,成为许多网站运营者头疼的问题,就为大家分享5步解决网站收录难题,让你的网站快速被搜索引擎抓取! 优化网站结构 1、清晰的导航:网站结构要清晰,方便用户快速找到所需内容,也要方便搜索引擎爬虫抓取,建议采用扁平化结构,减少层级,使网站结构更加简洁。 2、合理的URL:U…

    2025年5月8日
    00
  • 网站首页代码写错导致不收录,揭秘优化与修复之道

    随着互联网的飞速发展,网站已经成为企业展示形象、拓展业务的重要平台,在网站建设过程中,许多企业都面临着网站首页代码写错导致不收录的难题,这不仅影响了网站的访问量,还可能对企业的品牌形象造成负面影响,本文将深入剖析网站首页代码写错不收录的原因,并提出相应的优化与修复方法。 网站首页代码写错导致不收录的原因 1、HTML代码错误 HTML代码是网站页面的基础,如…

    2025年3月24日
    00
  • 网站收录流程图模板,助力搜索引擎优化,提升网站排名

    随着互联网的飞速发展,网站数量呈爆炸式增长,如何在众多网站中脱颖而出,成为搜索引擎关注的焦点,成为许多网站运营者关心的问题,而搜索引擎优化(SEO)便是解决这一问题的关键,网站收录流程图模板在SEO过程中发挥着重要作用,本文将为您详细介绍网站收录流程图模板及其制作方法,帮助您更好地优化网站,提升网站排名。 网站收录流程图模板概述 网站收录流程图模板是一种用于…

    2025年3月25日
    00
  • IIS服务器配置phpstudy相关设置

            在网站建设中,配置IIS服务器对新手来说算是比较复杂的了,秀站网刚开始也是一头雾水。为让小白用户使用更简洁,一般的服务器供应商会在服务器端安装通用镜像,也就是用户只需要懂得怎么设置就行。如阿里云就有许多一键部署的公共镜像。 ↑公共镜像解决了许多小白安装服务器软件的…

    2025年1月12日
    00

联系我们

400-800-8888

在线咨询: QQ交谈

邮件:admin@example.com

工作时间:周一至周五,9:30-18:30,节假日休息

关注微信