PbootCMS 常用 if 判断之分页page样式

判断列表页有无内容，无内容返回提示

{pboot:if({page:rows}>0)}
  <div class="pagination">
    <span>{page:status}</span>
    <a class="page-item page-link hidden-sm" href="{page:index}">首页</a>
    <a class="page-item page-link" href="{page:pre}">上一页</a>
    {page:numbar}
    <a class="page-item page-link" href="{page:next}">下一页</a>
    <a class="page-item page-link hidden-sm" href="{page:last}">尾页</a>
  </div>
  {else}
  <div class="tac text-secondary">本分类下无任何数据！</div>
{/pboot:if}

分页判断进阶，在第一页时隐藏首页和上一页按钮，在最后一页时隐藏下一页和尾页按钮

{pboot:if({page:rows}>0)}
<div class="page">
<a href="{page:index}"{pboot:2if('{page:current}'==1)}class="hide"{/pboot:2if}>首页</a>  <!--在第一页时，当前页码‘{page:current}’等于1，添加‘hide’样式，.hide{dispaly:none;}-->
<a href="{page:pre}"{pboot:2if('{page:current}'==1)}class="hide"{/pboot:2if}>上一页</a>  <!--与上条同理-->
{page:numbar}
<a href="{page:next}"{pboot:2if('{page:current}'=='{page:count}')}class="hide"{/pboot:2if}>下一页</a>  <!--在最后一页时，当前页码‘{page:current}’等于总页数‘{page:count}，’添加‘hide’样式，.hide{dispaly:none;}-->
<a href="{page:last}"{pboot:2if('{page:current}'=='{page:count}')}class="hide"{/pboot:2if}>尾页</a><!--与上条同理-->
</div>
{else}
<div class="page">暂无内容</div>
{/pboot:if}

配套的css，可根据需求自行更改

<style type="text/css">
.pagination { display: flex; justify-content: center; margin-top: 10px;}
.pagination a { background: #fff; border: 1px solid #ccc; color: #333; font-size: 14px; padding: 3px 12px; margin: 0 3px; border-radius: 3px;}
.pagination span { color: #333; font-size: 14px; padding: 3px 2px; margin: 0 3px; border-radius: 3px;}
.pagination a:hover { color: #fff; border: 1px solid #000;background: #000;}
.pagination a.page-num-current { color: #fff; background: #000; border: 1px solid #000;}
</style>

• 文章标题：PbootCMS 常用 if 判断之分页page样式
• 文章标签： 更多
• 版权声明：本文为CMS圈所分享发布内容，部分为网络转载，如有侵权请立即联系我们，我们第一时间删除并致歉！