纯css制作20款不同的分页样式

纯css手工制作20款不同的分页样式，喜欢哪种，可从demo.css找对应的分页样式。

淘建站为您提供更多_html/css_分页_分页_page，在此特别感谢您对我们的支持与厚爱！

green-black（Thinkphp 官网分页样式）

<div class="green-black">
    <span class="disabled"> &lt; Prev</span>
    <span class="current">1</span>
    <a href="#?page=2">2</a>
    <a href="#?page=3">3</a>
    <a href="#?page=4">4</a>
    <a href="#?page=5">5</a>
    <a href="#?page=6">6</a>
    <a href="#?page=7">7</a>...
    <a href="#?page=199">199</a>
    <a href="#?page=200">200</a>
    <a href="#?page=2">Next &gt; </a>
</div>

div.green-black{padding:3px;margin:3px;text-align:center;}
div.green-black a{border:#2c2c2c 1px solid;padding:2px 5px;background:url(../images/image1.gif) #2c2c2c;color:#fff;margin:0 2px 0 0;text-decoration:none;}
div.green-black a:hover{border:#aad83e 1px solid;background:url(../images/image2.gif) #aad83e;color:#fff;}
div.green-black a:active{border:#aad83e 1px solid;background:url(../images/image2.gif) #aad83e;color:#fff;}
div.green-black span.current{border:#aad83e 1px solid;padding:2px 5px;font-weight:bold;background:url(../images/image2.gif) #aad83e;color:#fff;margin:0 2px 0 0;}
div.green-black span.disabled{border:#f3f3f3 1px solid;padding:2px 5px;color:#ccc;margin:0 2px 0 0;}