广告位招租 qq245909083

dedecms 5.7 列表页分页样式修改

分享时间:2017-12-23 871 热度℃

目录 经常有人遇到分页代码错位,样式不对等问题。这里说下两种应对方法。
列表页分页代码
{dede:pagelist listitem="index,end,pre,next,pageno,option" listsize="4"/}
复制代码
其中index为首页,end末页,pre上一页,next下一页,pageno页码,option下拉选择,listsize 4条分页。可根据需要使用这些项目。
显示在html效果为:
<li>首页</li>
<li class="thisclass">1</li>
<li><a href="list_1_2.html">2</a></li>
<li><a href="list_1_3.html">3</a></li>
<li><a href="list_1_4.html">4</a></li>
<li><a href="list_1_2.html">下一页</a></li>
<li><a href="list_1_4.html">末页</a></li>
<li><select name="sldd" style="width:36px" onchange="location.href=this.options[this.selectedIndex].value;">
<option value="list_1_1.html" selected="">1</option>
<option value="list_1_2.html">2</option>
<option value="list_1_3.html">3</option>
<option value="list_1_4.html">4</option>
</select></li>
复制代码
其中可见,dedecms分页标签自动加了一些html标签,包括<li><a><select><option>,这样出来的这些东西经常是错乱的。
现在摆在我们面前两条路:
第一、css配合html,完全按它生成出来所带的各种html标签来做样式,如:
<div class="page">
{dede:pagelist listitem="index,end,pre,next,pageno,option" listsize="4"/}
</div>
复制代码
生成出来的就是:
<div class="page">
<li>首页</li>
<li class="thisclass">1</li>
<li><a href="list_1_2.html">2</a></li>
<li><a href="list_1_3.html">3</a></li>
<li><a href="list_1_4.html">4</a></li>
<li><a href="list_1_2.html">下一页</a></li>
<li><a href="list_1_4.html">末页</a></li>
<li><select name="sldd" style="width:36px" onchange="location.href=this.options[this.selectedIndex].value;">
<option value="list_1_1.html" selected="">1</option>
<option value="list_1_2.html">2</option>
<option value="list_1_3.html">3</option>
<option value="list_1_4.html">4</option>
</select></li>
</div>
复制代码
css配合写一些样式
.page ul li{……}
.page ul li.thisclass{……}
.page ul li a{……}
/*……省略N行……*/
复制代码
虽然这样需要重新写分页CSS,但这是最保险和最简单的。
这些元素我们是可以控制样式的。
第二、修改系统文件内的html标签,配合css
打开根目录下include/arc.listview.class.php文件查找
function GetPageListST($list_len,$listitem="index,end,pre,next,pageno")
复制代码
在这之下可以看到很多<li><a>标签,没错,这就是dedecms分页标签所包含的内容,<li class=\"thisclass\">$j</li>这其中的thisclass代表的是当前所在页码样式。
修改后需要重新生成页面才有最新效果。
文章标题:dedecms 5.7 列表页分页样式修改

本文地址:http://www.aizhanku.com/t34737

本文标签:
返回顶部