a的分页样式

最新推荐文章于 2022-10-21 15:08:20 发布

wangzi6hao

最新推荐文章于 2022-10-21 15:08:20 发布

阅读量221

点赞数

分类专栏： Css 文章标签： JavaScript ViewUI

本文链接：https://blog.csdn.net/wangzi6hao/article/details/83495288

版权

Css 专栏收录该内容

1 篇文章

订阅专栏

<div id="pagination_box">
<style>
/*---分页S---*/
#pagination_box {clear: both;overflow: hidden;height: 20px;text-align: center;margin-top: 10px;zoom: 1;line-height: 20px;}
#pagination_box a {border: 1px solid #BACBDD;margin-right: 2px;margin-left: 2px;padding-top: 2px;padding-right: 5px;padding-bottom: 2px;padding-left: 5px;overflow: hidden;font-family: "宋体";}
#pagination_box a:link {color: #497098;}
#pagination_box a:visited {color: #497098;}
#pagination_box a:hover {color: #FFFFFF;background-color: #658CB4;text-decoration: none;}
#pagination_box a:active {color: #497098;}
#pagination_box .currentlyPage:link {color: #ffffff;background-color: #658CB4;}
#pagination_box .currentlyPage:visited {color: #ffffff;background-color: #658CB4;;}
#pagination_box .currentlyPage:hover {color: #ffffff;background-color: #658CB4;}
#pagination_box .currentlyPage:active {color: #ffffff;background-color: #658CB4;}
#pagination_box .PB_input {width: 20px;overflow: hidden;border: 1px solid #CCCCCC;vertical-align: middle;}
#pagination_box .PB_but {cursor: hand;padding-left: 5px;vertical-align: middle;padding-bottom: 5px;margin-top: 4px;}
/*---分页E---*/
</style>
   
        共<strong>16</strong>条 当前第<strong>1</strong>至<strong>3</strong>条
        <a class="currentlyPage" href="javascript:void(0);">1</a>
       
        <a href="userList.action?pager.offset=3&amp;pageNo=2">2</a>

        <a href="userList.action?pager.offset=6&amp;pageNo=3">3</a>

        <a href="userList.action?pager.offset=9&amp;pageNo=4">4</a>

        <a href="userList.action?pager.offset=12&amp;pageNo=5">5</a>

        <a href="userList.action?pager.offset=15&amp;pageNo=6">6</a>

        <a href="userList.action?pager.offset=3&amp;pageNo=2">下一页</a>

        <a href="userList.action?pager.offset=15&amp;pageNo=6">前进5页</a>
   
        <a href="userList.action?pager.offset=15&amp;pageNo=6">尾页</a>

        </div>

效果如图: