CSS中上一页下一页怎么做？？图片所示那中

发一个给你吧，
<style>
DIV.fenye {
PADDING-RIGHT: 3px; PADDING-LEFT: 3px; PADDING-BOTTOM: 3px; MARGIN: 3px; PADDING-TOP: 3px; TEXT-ALIGN: center
}
DIV.fenye A {
BORDER-RIGHT: #fff 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #fff 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 2px; MARGIN: 2px; BORDER-LEFT: #fff 1px solid; COLOR: #000099; PADDING-TOP: 2px; BORDER-BOTTOM: #fff 1px solid; TEXT-DECORATION: underline
}
DIV.fenye A:hover {
BORDER-RIGHT: #000099 1px solid; BORDER-TOP: #000099 1px solid; BORDER-LEFT: #000099 1px solid; COLOR: #000; BORDER-BOTTOM: #000099 1px solid
}
DIV.fenye A:active {
BORDER-RIGHT: #000099 1px solid; BORDER-TOP: #000099 1px solid; BORDER-LEFT: #000099 1px solid; COLOR: #f00; BORDER-BOTTOM: #000099 1px solid
}
DIV.fenye SPAN.current {
BORDER-RIGHT: #fff 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #fff 1px solid; PADDING-LEFT: 5px; FONT-WEIGHT: bold; PADDING-BOTTOM: 2px; MARGIN: 2px; BORDER-LEFT: #fff 1px solid; COLOR: #000; PADDING-TOP: 2px; BORDER-BOTTOM: #fff 1px solid; BACKGROUND-COLOR: #fff
}
DIV.fenye SPAN.disabled {
BORDER-RIGHT: #eee 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #eee 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 2px; MARGIN: 2px; BORDER-LEFT: #eee 1px solid; COLOR: #ddd; PADDING-TOP: 2px; BORDER-BOTTOM: #eee 1px solid
}
</style>
<div class=fenye><span class=disabled> < </span><span class=current>1</span><a href=2>2</a><a href=3>3</a><a href=4>4</a><a href=5>5</a><a href=6>6</a><a href=7>7</a>...<a href=199>199</a><a href=200>200</a><a href=2> > </a></div>

可以扩展许多种自己需要的。本回答被提问者采纳

直接用链接就可以：

<style>
a{padding:0 5px;/*两个链接之间的距离*/}
a.selected{text-decoration:none;} 为选中的标签样式
</style>
<a href="">1</a> <a href="">1</a> <a href="">1</a>

用 无序列表（<ul> <li>）就可以了。样式加左间距