起初,我想通过写'theme'来定制分页样式的。如:
<li class="first">%first%</li><li class="prev">%upPage%</li><li class="num">%linkPage%</li><li class="next">%downPage%</li><li class="end">%end%<li>
但是后来发现如果在第一页%first%是不输出数据的,那么<li class="first">%first%</li>就只剩下了<li class="first"></li>,十分难看。最终迫不得已区修改Page.class.php文件,即将<li>标签写到文件中和<a>标签一起输出。修改后的Page.class.php见附件。
配上自己写的css:
.pagelist { float:right;}
.pagelist li { float:left; color: white; background-color:#f0c389; width: 28px;height: 28px;line-height: 28px; margin:0 4px; text-align:center;background-image: url(/Public/Images/icon_pagelist.png);background-repeat: no-repeat; background-position:24px 24px;}
.pagelist li:hover { background-color:#b59a72;}
.pagelist li span.current { background-color:#b59a72;}
.pagelist li a,.pagelist li span { color: white; width: 28px;height: 28px;line-height: 28px; text-align:center; display:block; float:left;}
.pagelist li a:hover { text-decoration:none;}
.pagelist li.first {background-position: 3px 5px;text-indent: -9999px;}
.pagelist li.prev {background-position: -21px 5px;text-indent: -9999px;}
.pagelist li.next {background-position: -43px 5px;text-indent: -9999px;}
.pagelist li.end {background-position: -69px 5px;text-indent: -9999px;}
.pagelist li.num { width:auto; background:#f0c389;}
.pagelist li.num:hover { background:#f0c389;}
.pagelist li.num a:hover { background-color:#b59a72;}
效果如下图:刚修正了一个小bug,只有一页时,有个多余的小竖条。
Page.class.zip
( 5.16 KB 下载:763 次 )
最佳答案
