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

html-css016

CSS中上一页下一页怎么做？？图片所示那中,第1张

发一个给你吧，

<style>

DIV.fenye {

PADDING-RIGHT: 3pxPADDING-LEFT: 3pxPADDING-BOTTOM: 3pxMARGIN: 3pxPADDING-TOP: 3pxTEXT-ALIGN: center

}

DIV.fenye A {

BORDER-RIGHT: #fff 1px solidPADDING-RIGHT: 5pxBORDER-TOP: #fff 1px solidPADDING-LEFT: 5pxPADDING-BOTTOM: 2pxMARGIN: 2pxBORDER-LEFT: #fff 1px solidCOLOR: #000099PADDING-TOP: 2pxBORDER-BOTTOM: #fff 1px solidTEXT-DECORATION: underline

}

DIV.fenye A:hover {

BORDER-RIGHT: #000099 1px solidBORDER-TOP: #000099 1px solidBORDER-LEFT: #000099 1px solidCOLOR: #000BORDER-BOTTOM: #000099 1px solid

}

DIV.fenye A:active {

BORDER-RIGHT: #000099 1px solidBORDER-TOP: #000099 1px solidBORDER-LEFT: #000099 1px solidCOLOR: #f00BORDER-BOTTOM: #000099 1px solid

}

DIV.fenye SPAN.current {

BORDER-RIGHT: #fff 1px solidPADDING-RIGHT: 5pxBORDER-TOP: #fff 1px solidPADDING-LEFT: 5pxFONT-WEIGHT: boldPADDING-BOTTOM: 2pxMARGIN: 2pxBORDER-LEFT: #fff 1px solidCOLOR: #000PADDING-TOP: 2pxBORDER-BOTTOM: #fff 1px solidBACKGROUND-COLOR: #fff

}

DIV.fenye SPAN.disabled {

BORDER-RIGHT: #eee 1px solidPADDING-RIGHT: 5pxBORDER-TOP: #eee 1px solidPADDING-LEFT: 5pxPADDING-BOTTOM: 2pxMARGIN: 2pxBORDER-LEFT: #eee 1px solidCOLOR: #dddPADDING-TOP: 2pxBORDER-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>

可以扩展许多种自己需要的。

自动适应宽高如果满屏用100%

如果按用户电脑分辩率自动适应样式要写JS 这个JS就不多说了因为太多了

最小高 min-hgight:值

固定宽高:width:值height:值

明白了?