dede:pagelist分页样式和内容页分页与CSS错位的问题 占个座位先
28 一 2010
列表页分页:
<divclass="dede_pages">
<ulclass="pagelist">{dede:pagelistlistitem="info,index,end,pre,next,pageno"listsize="5"/}</ul>
</div>
这个是默认的,一般我们仿站时都会碰到下面的情况
<divclass="pages">
{dede:pagelistlistitem="info,index,end,pre,next,pageno"listsize="5"/}
</div>
如果你用他们网站本身的CSS,列表分页一定错位或者竖着,不会达到理想效果。如果会修改CSS这个问题可以解决,但很麻烦。
<divclass="pages">
{dede:pagelistlistitem="info,index,end,pre,next,pageno"listsize="5"/}</div>这段代码在前台默认是这样读取的:
<divclass="pages">
<spanclass="pageinfo">共<strong>36</strong>页<strong>704</strong>条</span><li>首页</li>织梦内容管理系统
<liclass="thisclass">1</li>
<li><ahref=\’list_6_2.html\’>2</a></li>。
。。。。。(略)
而我们一般要达到下面的代码才能与仿的网站相同
<divclass="pages">
共2页39条<strong>首页</strong>
<strong>1</strong>
<ahref=\’list_42_2.html\’>2</a>
<ahref=\’list_42_2.html\’>下一页</a>
<ahref=\’list_42_2.html\’>末页</a>
</div>
看出什么了吧?有几个标签不该显示<li><liclass="thisclass>
怎么修改呢?
表现为分页时候变成了
[attachment=28741]
这样其实也可以解决
在pagelist标记套一个ul标记,然后再用css来控制。重点css是:li标签样式的float:left
然而这样的话个人认为比较麻烦,不如直接用5.1的方式来的轻巧。
去掉这个讨厌的<li>标签:
在include/arc.listview.class.php中删除相应的<li>代码,输出就变成5.1的形式了。
另外,include/arc.listview.class.php中option代码注释掉了,恢复就能用了。
方法二:(如果想用ul和li来表达的话)
如果你的分页依然想用ul和li嵌套的话.那也是可以的.方法跟方法一差不多.只不过不是像方法一那样把li删掉那么直接.直接把你li和span样式都放到php文件中去.一样能实现.只不过这个方法对你日后想要修改css的话就比较麻烦点.
方法三:(比较直观的方法)
首先要把那个标签放在一个容器里
<ulclass=\’pagelist\’>{dede:pagelistlistsize=\’7\’/}</ul>
然后定义CSS
.pagelistli{float:left;margin-right:3px;}
内容页分页:{dede:pagebreak/}和列表页分页一样多了那几个标签<li><liclass="thisclass>
对应要修改的文件是:include/arc.archives.class.php
附件里有修改后的文件,以后分页代码就是:<divclass="pages">
{dede:pagelistlistitem="info,index,end,pre,next,pageno"listsize="5"/}
</div>
和<divclass="pages">{dede:pagebreak/}</div>
对应的CSS:
.pages{
text-align:right;
padding-bottom:15px;
padding-right:20px;
}
.pagesa:link{
display:inline;
border:1pxsolid#D9D9D9;
color:#001A9F;
padding:2px5px;
copyrightdedecms
margin:0px3px;
}
.pagesa:visited{
display:inline;
border:1pxsolid#D9D9D9;
color:#001A9F;
padding:2px5px;
margin:0px3px;
}
.pagesa:hover{
display:inline;
border:1pxsolid#8BCCEC;
color:#000000;
background:#E8F3FD;
padding:2px5px;
margin:0px3px;
}
.pages.click{
display:inline;
border:1pxsolid#ff831e;
color:#000000;
background:#ffebd9;
padding:2px5px;
margin:0px3px;
}
- No Comments , 257 views Hits
-
标签:dedecms