二十幾種CSS分頁效果

CSS：

BODY { FONT-SIZE: 12px;FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif; WIDTH: 60%; PADDING-LEFT: 25px;} DIV.youtube { PADDING-RIGHT: 6px; BORDER-TOP: #9c9a9c 1px dotted; PADDING-LEFT: 0px; FONT-SIZE: 13px; PADDING-BOTTOM: 4px; COLOR: #313031; PADDING-TOP: 4px; FONT-FAMILY: Arial, Helvetica, sans-serif; BACKGROUND-COLOR: #cecfce; TEXT-ALIGN: right} DIV.youtube A { PADDING-RIGHT: 3px; PADDING-LEFT: 3px; FONT-WEIGHT: bold; PADDING-BOTTOM: 1px; MARGIN: 0px 1px; COLOR: #0030ce; PADDING-TOP: 1px; TEXT-DECORATION: underline} DIV.youtube SPAN.current { PADDING-RIGHT: 2px; PADDING-LEFT: 2px; PADDING-BOTTOM: 1px; COLOR: #000; PADDING-TOP: 1px; BACKGROUND-COLOR: #fff} DIV.youtube SPAN.disabled { DISPLAY: none } DIV.msdn { PADDING-RIGHT: 6px; PADDING-LEFT: 0px; FONT-SIZE: 13px; PADDING-BOTTOM: 4px; COLOR: #313031; PADDING-TOP: 4px; FONT-FAMILY: Verdana,Tahoma,Arial,Helvetica,Sans-Serif; BACKGROUND-COLOR: #fff; TEXT-ALIGN: right} DIV.msdn A { BORDER-RIGHT: #b7d8ee 1px solid; PADDING-RIGHT: 6px; BORDER-TOP: #b7d8ee 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 4px; MARGIN: 0px 3px; BORDER-LEFT: #b7d8ee 1px solid; COLOR: #0030ce; PADDING-TOP: 5px; BORDER-BOTTOM: #b7d8ee 1px solid; TEXT-DECORATION: none} DIV.msdn A:hover { BORDER-RIGHT: #b7d8ee 1px solid; BORDER-TOP: #b7d8ee 1px solid; BORDER-LEFT: #b7d8ee 1px solid; COLOR: #0066a7; BORDER-BOTTOM: #b7d8ee 1px solid; BACKGROUND-COLOR: #d2eaf6} DIV.pagination A:active { BORDER-RIGHT: #b7d8ee 1px solid; BORDER-TOP: #b7d8ee 1px solid; BORDER-LEFT: #b7d8ee 1px solid; COLOR: #0066a7; BORDER-BOTTOM: #b7d8ee 1px solid; BACKGROUND-COLOR: #d2eaf6} DIV.msdn SPAN.current { BORDER-RIGHT: #b7d8ee 1px solid; PADDING-RIGHT: 6px; BORDER-TOP: #b7d8ee 1px solid; PADDING-LEFT: 5px; FONT-WEIGHT: bold; PADDING-BOTTOM: 4px; MARGIN: 0px 3px; BORDER-LEFT: #b7d8ee 1px solid; COLOR: #444444; PADDING-TOP: 5px; BORDER-BOTTOM: #b7d8ee 1px solid; BACKGROUND-COLOR: #d2eaf6} DIV.msdn SPAN.disabled { DISPLAY: none} DIV.badoo { PADDING-RIGHT: 0px; PADDING-LEFT: 0px; FONT-SIZE: 13px; PADDING-BOTTOM: 10px; COLOR: #48b9ef; PADDING-TOP: 10px; FONT-FAMILY: Arial, Helvetica, sans-serif; BACKGROUND-COLOR: #fff; TEXT-ALIGN: center} DIV.badoo A { BORDER-RIGHT: #f0f0f0 2px solid; PADDING-RIGHT: 5px; BORDER-TOP: #f0f0f0 2px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 2px; MARGIN: 0px 2px; BORDER-LEFT: #f0f0f0 2px solid; COLOR: #48b9ef; PADDING-TOP: 2px; BORDER-BOTTOM: #f0f0f0 2px solid; TEXT-DECORATION: none} DIV.badoo A:hover { BORDER-RIGHT: #ff5a00 2px solid; BORDER-TOP: #ff5a00 2px solid; BORDER-LEFT: #ff5a00 2px solid; COLOR: #ff5a00; BORDER-BOTTOM: #ff5a00 2px solid} DIV.badoo A:active { BORDER-RIGHT: #ff5a00 2px solid; BORDER-TOP: #ff5a00 2px solid; BORDER-LEFT: #ff5a00 2px solid; COLOR: #ff5a00; BORDER-BOTTOM: #ff5a00 2px solid} DIV.badoo SPAN.current { BORDER-RIGHT: #ff5a00 2px solid; PADDING-RIGHT: 5px; BORDER-TOP: #ff5a00 2px solid; PADDING-LEFT: 5px; FONT-WEIGHT: bold; PADDING-BOTTOM: 2px; COLOR: #fff; PADDING-TOP: 2px; BORDER-BOTTOM: #ff5a00 2px solid; BORDER-LEFT: #ff5a00 2px solid;BACKGROUND-COLOR: #ff6c16} DIV.badoo SPAN.disabled { DISPLAY: none } .manu { PADDING-RIGHT: 3px; PADDING-LEFT: 3px; PADDING-BOTTOM: 3px; MARGIN: 3px; PADDING-TOP: 3px; TEXT-ALIGN: center} .manu A { 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: #036cb4; PADDING-TOP: 2px; BORDER-BOTTOM: #eee 1px solid; TEXT-DECORATION: none} .manu A:hover { BORDER-RIGHT: #999 1px solid; BORDER-TOP: #999 1px solid; BORDER-LEFT: #999 1px solid; COLOR: #666; BORDER-BOTTOM: #999 1px solid} .manu A:active { BORDER-RIGHT: #999 1px solid; BORDER-TOP: #999 1px solid; BORDER-LEFT: #999 1px solid; COLOR: #666; BORDER-BOTTOM: #999 1px solid} .manu .current { BORDER-RIGHT: #036cb4 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #036cb4 1px solid; PADDING-LEFT: 5px; FONT-WEIGHT: bold; PADDING-BOTTOM: 2px; MARGIN: 2px; BORDER-LEFT: #036cb4 1px solid; COLOR: #fff; PADDING-TOP: 2px; BORDER-BOTTOM: #036cb4 1px solid; BACKGROUND-COLOR: #036cb4} .manu .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} DIV.green-black { PADDING-RIGHT: 3px; PADDING-LEFT: 3px; PADDING-BOTTOM: 3px; MARGIN: 3px; PADDING-TOP: 3px; TEXT-ALIGN: center} DIV.green-black A { BORDER-RIGHT: #2c2c2c 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #2c2c2c 1px solid; PADDING-LEFT: 5px; BACKGROUND: #2c2c2c; PADDING-BOTTOM: 2px; BORDER-LEFT: #2c2c2c 1px solid; COLOR: #fff; MARGIN-RIGHT: 2px; PADDING-TOP: 2px; BORDER-BOTTOM: #2c2c2c 1px solid; TEXT-DECORATION: none} DIV.green-black A:hover { BORDER-RIGHT: #aad83e 1px solid; BORDER-TOP: #aad83e 1px solid; BACKGROUND: #aad83e; BORDER-LEFT: #aad83e 1px solid; COLOR: #fff; BORDER-BOTTOM: #aad83e 1px solid} DIV.green-black A:active { BORDER-RIGHT: #aad83e 1px solid; BORDER-TOP: #aad83e 1px solid; BACKGROUND: #aad83e; BORDER-LEFT: #aad83e 1px solid; COLOR: #fff; BORDER-BOTTOM: #aad83e 1px solid} DIV.green-black SPAN.current { BORDER-RIGHT: #aad83e 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #aad83e 1px solid; PADDING-LEFT: 5px; FONT-WEIGHT: bold; BACKGROUND: url(image2.gif) #aad83e; PADDING-BOTTOM: 2px; BORDER-LEFT: #aad83e 1px solid; COLOR: #fff; MARGIN-RIGHT: 2px; PADDING-TOP: 2px; BORDER-BOTTOM: #aad83e 1px solid} DIV.green-black SPAN.disabled { BORDER-RIGHT: #f3f3f3 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #f3f3f3 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 2px; BORDER-LEFT: #f3f3f3 1px solid; COLOR: #ccc; MARGIN-RIGHT: 2px; PADDING-TOP: 2px; BORDER-BOTTOM: #f3f3f3 1px solid} DIV.viciao { MARGIN-TOP: 20px; MARGIN-BOTTOM: 10px} DIV.viciao A { BORDER-RIGHT: #8db5d7 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #8db5d7 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 2px; BORDER-LEFT: #8db5d7 1px solid; COLOR: #000; MARGIN-RIGHT: 2px; PADDING-TOP: 2px; BORDER-BOTTOM: #8db5d7 1px solid; TEXT-DECORATION: none} DIV.viciao A:hover { BORDER-RIGHT: red 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: red 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 2px; BORDER-LEFT: red 1px solid; MARGIN-RIGHT: 2px; PADDING-TOP: 2px; BORDER-BOTTOM: red 1px solid} DIV.viciao A:active { BORDER-RIGHT: red 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: red 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 2px; BORDER-LEFT: red 1px solid; MARGIN-RIGHT: 2px; PADDING-TOP: 2px; BORDER-BOTTOM: red 1px solid} DIV.viciao SPAN.current { BORDER-RIGHT: #e89954 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #e89954 1px solid; PADDING-LEFT: 5px; FONT-WEIGHT: bold; PADDING-BOTTOM: 2px; BORDER-LEFT: #e89954 1px solid; COLOR: #000; MARGIN-RIGHT: 2px; PADDING-TOP: 2px; BORDER-BOTTOM: #e89954 1px solid; BACKGROUND-COLOR: #ffca7d} DIV.viciao SPAN.disabled { BORDER-RIGHT: #ccc 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #ccc 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 2px; BORDER-LEFT: #ccc 1px solid; COLOR: #ccc; MARGIN-RIGHT: 2px; PADDING-TOP: 2px; BORDER-BOTTOM: #ccc 1px solid} DIV.yahoo2 { PADDING-RIGHT: 3px; PADDING-LEFT: 3px; FONT-SIZE: 0.85em; PADDING-BOTTOM: 3px; MARGIN: 3px; PADDING-TOP: 3px; FONT-FAMILY: Tahoma,Helvetica,sans-serif; TEXT-ALIGN: center} DIV.yahoo2 A { BORDER-RIGHT: #ccdbe4 1px solid; PADDING-RIGHT: 8px; BACKGROUND-POSITION: 50% bottom; BORDER-TOP: #ccdbe4 1px solid; PADDING-LEFT: 8px; PADDING-BOTTOM: 2px; BORDER-LEFT: #ccdbe4 1px solid; COLOR: #0061de; MARGIN-RIGHT: 3px; PADDING-TOP: 2px; BORDER-BOTTOM: #ccdbe4 1px solid; TEXT-DECORATION: none} DIV.yahoo2 A:hover { BORDER-RIGHT: #2b55af 1px solid; BORDER-TOP: #2b55af 1px solid; BACKGROUND-IMAGE: none; BORDER-LEFT: #2b55af 1px solid; COLOR: #fff; BORDER-BOTTOM: #2b55af 1px solid; BACKGROUND-COLOR: #3666d4} DIV.yahoo2 A:active { BORDER-RIGHT: #2b55af 1px solid; BORDER-TOP: #2b55af 1px solid; BACKGROUND-IMAGE: none; BORDER-LEFT: #2b55af 1px solid; COLOR: #fff; BORDER-BOTTOM: #2b55af 1px solid; BACKGROUND-COLOR: #3666d4} DIV.yahoo2 SPAN.current { PADDING-RIGHT: 6px; PADDING-LEFT: 6px; FONT-WEIGHT: bold; PADDING-BOTTOM: 2px; COLOR: #000; MARGIN-RIGHT: 3px; PADDING-TOP: 2px} DIV.yahoo2 SPAN.disabled { DISPLAY: none} DIV.yahoo2 A.next { BORDER-RIGHT: #ccdbe4 2px solid; BORDER-TOP: #ccdbe4 2px solid; MARGIN: 0px 0px 0px 10px; BORDER-LEFT: #ccdbe4 2px solid; BORDER-BOTTOM: #ccdbe4 2px solid} DIV.yahoo2 A.next:hover { BORDER-RIGHT: #2b55af 2px solid; BORDER-TOP: #2b55af 2px solid; BORDER-LEFT: #2b55af 2px solid; BORDER-BOTTOM: #2b55af 2px solid} DIV.yahoo2 A.prev { BORDER-RIGHT: #ccdbe4 2px solid; BORDER-TOP: #ccdbe4 2px solid; MARGIN: 0px 10px 0px 0px; BORDER-LEFT: #ccdbe4 2px solid; BORDER-BOTTOM: #ccdbe4 2px solid} DIV.yahoo2 A.prev:hover { BORDER-RIGHT: #2b55af 2px solid; BORDER-TOP: #2b55af 2px solid; BORDER-LEFT: #2b55af 2px solid; BORDER-BOTTOM: #2b55af 2px solid}

HTML：

<P>YouTube Style <DIV class=youtube><SPAN class=disabled>Prev</SPAN><SPAN class=current>1</SPAN> <A href="#?page=2" mce_href="#?page=2">2</A><A href="#?page=3" mce_href="#?page=3">3</A><A href="#?page=4" mce_href="#?page=4">4</A> <A href="#?page=5" mce_href="#?page=5">5</A><A href="#?page=6" mce_href="#?page=6">6</A><A href="#?page=7" mce_href="#?page=7">7</A>... <A href="#?page=199" mce_href="#?page=199">199</A><A href="#?page=200" mce_href="#?page=200">200</A><A href="#?page=2" mce_href="#?page=2">Next</A></DIV> <P></P> <P>MSDN Search Style <DIV class=msdn><SPAN class=disabled>< Prev</SPAN><SPAN class=current>1</SPAN> <A href="#?page=2" mce_href="#?page=2">2</A><A href="#?page=3" mce_href="#?page=3">3</A><A href="#?page=4" mce_href="#?page=4">4</A> <A href="#?page=5" mce_href="#?page=5">5</A><A href="#?page=6" mce_href="#?page=6">6</A><A href="#?page=7" mce_href="#?page=7">7</A>... <A href="#?page=199" mce_href="#?page=199">199</A><A href="#?page=200" mce_href="#?page=200">200</A><A href="#?page=2" mce_href="#?page=2">Next > </A></DIV> <P></P> <P>Badoo Style <DIV class=badoo><SPAN class=disabled>< Prev</SPAN><SPAN class=current>1</SPAN> <A href="#?page=2" mce_href="#?page=2">2</A><A href="#?page=3" mce_href="#?page=3">3</A><A href="#?page=4" mce_href="#?page=4">4</A> <A href="#?page=5" mce_href="#?page=5">5</A><A href="#?page=6" mce_href="#?page=6">6</A><A href="#?page=7" mce_href="#?page=7">7</A>... <A href="#?page=199" mce_href="#?page=199">199</A><A href="#?page=200" mce_href="#?page=200">200</A><A href="#?page=2" mce_href="#?page=2">Next > </A></DIV> <P></P> <P>Blue Style <DIV class=manu><SPAN class=disabled>< Prev</SPAN><SPAN class=current>1</SPAN> <A href="#?page=2" mce_href="#?page=2">2</A><A href="#?page=3" mce_href="#?page=3">3</A><A href="#?page=4" mce_href="#?page=4">4</A> <A href="#?page=5" mce_href="#?page=5">5</A><A href="#?page=6" mce_href="#?page=6">6</A><A href="#?page=7" mce_href="#?page=7">7</A>... <A href="#?page=199" mce_href="#?page=199">199</A><A href="#?page=200" mce_href="#?page=200">200</A><A href="#?page=2" mce_href="#?page=2">Next > </A></DIV> <P></P> <P>Green-Black Style <DIV class=green-black><SPAN class=disabled>< Prev</SPAN><SPAN class=current>1</SPAN> <A href="#?page=2" mce_href="#?page=2">2</A><A href="#?page=3" mce_href="#?page=3">3</A><A href="#?page=4" mce_href="#?page=4">4</A> <A href="#?page=5" mce_href="#?page=5">5</A><A href="#?page=6" mce_href="#?page=6">6</A><A href="#?page=7" mce_href="#?page=7">7</A>... <A href="#?page=199" mce_href="#?page=199">199</A><A href="#?page=200" mce_href="#?page=200">200</A><A href="#?page=2" mce_href="#?page=2">Next > </A></DIV> <P></P> <P>viciao Style <DIV class=viciao><SPAN class=disabled>< Prev</SPAN><SPAN class=current>1</SPAN> <A href="#?page=2" mce_href="#?page=2">2</A><A href="#?page=3" mce_href="#?page=3">3</A><A href="#?page=4" mce_href="#?page=4">4</A> <A href="#?page=5" mce_href="#?page=5">5</A><A href="#?page=6" mce_href="#?page=6">6</A><A href="#?page=7" mce_href="#?page=7">7</A>... <A href="#?page=199" mce_href="#?page=199">199</A><A href="#?page=200" mce_href="#?page=200">200</A><A href="#?page=2" mce_href="#?page=2">Next > </A></DIV> <h3 align="right">www.865171.cn</h3>

 

 

 

 

CSS：

BODY { FONT-SIZE: 12px;FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif; WIDTH: 60%; PADDING-LEFT: 25px;} DIV.yellow { PADDING-RIGHT: 7px; PADDING-LEFT: 7px; PADDING-BOTTOM: 7px; MARGIN: 3px; PADDING-TOP: 7px; TEXT-ALIGN: center} DIV.yellow A { BORDER-RIGHT: #ccc 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #ccc 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 2px; MARGIN: 2px; BORDER-LEFT: #ccc 1px solid; COLOR: #000; PADDING-TOP: 2px; BORDER-BOTTOM: #ccc 1px solid; TEXT-DECORATION: none} DIV.yellow A:hover { BORDER-RIGHT: #f0f0f0 1px solid; BORDER-TOP: #f0f0f0 1px solid; BORDER-LEFT: #f0f0f0 1px solid; COLOR: #000; BORDER-BOTTOM: #f0f0f0 1px solid} DIV.yellow A:active { BORDER-RIGHT: #f0f0f0 1px solid; BORDER-TOP: #f0f0f0 1px solid; BORDER-LEFT: #f0f0f0 1px solid; COLOR: #000; BORDER-BOTTOM: #f0f0f0 1px solid} DIV.yellow SPAN.current { BORDER-RIGHT: #d9d300 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #d9d300 1px solid; PADDING-LEFT: 5px; FONT-WEIGHT: bold; PADDING-BOTTOM: 2px; MARGIN: 2px; BORDER-LEFT: #d9d300 1px solid; COLOR: #fff; PADDING-TOP: 2px; BORDER-BOTTOM: #d9d300 1px solid; BACKGROUND-COLOR: #d9d300} DIV.yellow 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} DIV.jogger { PADDING-RIGHT:2px;PADDING-LEFT:2px;PADDING-BOTTOM:2px;MARGIN:7px; FONT-FAMILY:"Lucida Sans Unicode", "Lucida Grande", LucidaGrande, "Lucida Sans", Geneva, Verdana, sans-serif;PADDING-TOP: 2px;} DIV.jogger A { PADDING-RIGHT: 0.64em; PADDING-LEFT: 0.64em; PADDING-BOTTOM: 0.43em; MARGIN: 2px; COLOR: #fff; PADDING-TOP: 0.5em; BACKGROUND-COLOR: #ee4e4e; TEXT-DECORATION: none} DIV.jogger A:hover { PADDING-RIGHT: 0.64em; PADDING-LEFT: 0.64em; PADDING-BOTTOM: 0.43em; MARGIN: 2px; COLOR: #fff; PADDING-TOP: 0.5em; BACKGROUND-COLOR: #de1818} DIV.jogger A:active { PADDING-RIGHT: 0.64em; PADDING-LEFT: 0.64em; PADDING-BOTTOM: 0.43em; MARGIN: 2px; COLOR: #fff; PADDING-TOP: 0.5em; BACKGROUND-COLOR: #de1818} DIV.jogger SPAN.current { PADDING-RIGHT: 0.64em; PADDING-LEFT: 0.64em; PADDING-BOTTOM: 0.43em; MARGIN: 2px; COLOR: #6d643c; PADDING-TOP: 0.5em; BACKGROUND-COLOR: #f6efcc} DIV.jogger SPAN.disabled { DISPLAY: none} DIV.starcraft2 { PADDING-RIGHT: 3px; PADDING-LEFT: 3px; FONT-WEIGHT: bold; FONT-SIZE: 13.5pt; PADDING-BOTTOM: 3px; MARGIN: 3px; COLOR: #fff; PADDING-TOP: 3px; BACKGROUND-COLOR: #000; FONT-FAMILY: Arial; TEXT-ALIGN: center} DIV.starcraft2 A { MARGIN: 2px; COLOR: #fa0; BACKGROUND-COLOR: #000; TEXT-DECORATION: none} DIV.starcraft2 A:hover { COLOR: #fff; BACKGROUND-COLOR: #000} DIV.starcraft2 A:active { COLOR: #fff; BACKGROUND-COLOR: #000} DIV.starcraft2 SPAN.current { FONT-WEIGHT: bold; MARGIN: 2px; COLOR: #fff; BACKGROUND-COLOR: #000} DIV.starcraft2 SPAN.disabled { MARGIN: 2px; COLOR: #444; BACKGROUND-COLOR: #000} DIV.tres { PADDING-RIGHT: 7px; PADDING-LEFT: 7px; FONT-WEIGHT: bold; FONT-SIZE: 13.2pt; PADDING-BOTTOM: 7px; MARGIN: 3px; PADDING-TOP: 7px; FONT-FAMILY: Arial, Helvetica, sans-serif; TEXT-ALIGN: center} DIV.tres A { BORDER-RIGHT: #d9d300 2px solid; PADDING-RIGHT: 5px; BORDER-TOP: #d9d300 2px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 2px; MARGIN: 2px; BORDER-LEFT: #d9d300 2px solid; COLOR: #fff; PADDING-TOP: 2px; BORDER-BOTTOM: #d9d300 2px solid; BACKGROUND-COLOR: #d90; TEXT-DECORATION: none} DIV.tres A:hover { BORDER-RIGHT: #ff0 2px solid; BORDER-TOP: #ff0 2px solid; BORDER-LEFT: #ff0 2px solid; COLOR: #000; BORDER-BOTTOM: #ff0 2px solid; BACKGROUND-COLOR: #ff0} DIV.tres A:active { BORDER-RIGHT: #ff0 2px solid; BORDER-TOP: #ff0 2px solid; BORDER-LEFT: #ff0 2px solid; COLOR: #000; BORDER-BOTTOM: #ff0 2px solid; BACKGROUND-COLOR: #ff0} DIV.tres SPAN.current { BORDER-RIGHT: #fff 2px solid; PADDING-RIGHT: 5px; BORDER-TOP: #fff 2px solid; PADDING-LEFT: 5px; FONT-WEIGHT: bold; PADDING-BOTTOM: 2px; MARGIN: 2px; BORDER-LEFT: #fff 2px solid; COLOR: #000; PADDING-TOP: 2px; BORDER-BOTTOM: #fff 2px solid} DIV.tres SPAN.disabled { DISPLAY: none} DIV.megas512 { PADDING-RIGHT: 3px; PADDING-LEFT: 3px; PADDING-BOTTOM: 3px; MARGIN: 3px; PADDING-TOP: 3px; TEXT-ALIGN: center} DIV.megas512 A { BORDER-RIGHT: #dedfde 1px solid; PADDING-RIGHT: 6px; BACKGROUND-POSITION: 50% bottom; BORDER-TOP: #dedfde 1px solid; PADDING-LEFT: 6px; PADDING-BOTTOM: 2px; BORDER-LEFT: #dedfde 1px solid; COLOR: #99210b; MARGIN-RIGHT: 3px; PADDING-TOP: 2px; BORDER-BOTTOM: #dedfde 1px solid; TEXT-DECORATION: none} DIV.megas512 A:hover { BORDER-RIGHT: #000 1px solid; BORDER-TOP: #000 1px solid; BACKGROUND-IMAGE: none; BORDER-LEFT: #000 1px solid; COLOR: #fff; BORDER-BOTTOM: #000 1px solid; BACKGROUND-COLOR: #777777} DIV.megas512 A:active { BORDER-RIGHT: #000 1px solid; BORDER-TOP: #000 1px solid; BACKGROUND-IMAGE: none; BORDER-LEFT: #000 1px solid; COLOR: #fff; BORDER-BOTTOM: #000 1px solid; BACKGROUND-COLOR: #777777} DIV.megas512 SPAN.current { PADDING-RIGHT: 6px; PADDING-LEFT: 6px; FONT-WEIGHT: bold; PADDING-BOTTOM: 2px; COLOR: #99210b; MARGIN-RIGHT: 3px; PADDING-TOP: 2px} DIV.megas512 SPAN.disabled { PADDING-RIGHT: 6px; PADDING-LEFT: 6px; PADDING-BOTTOM: 2px; COLOR: #adaaad; MARGIN-RIGHT: 3px; PADDING-TOP: 2px} DIV.technorati { PADDING-RIGHT: 3px; PADDING-LEFT: 3px; PADDING-BOTTOM: 3px; MARGIN: 3px; PADDING-TOP: 3px; TEXT-ALIGN: center} DIV.technorati A { BORDER-RIGHT: #ccc 1px solid; PADDING-RIGHT: 6px; BACKGROUND-POSITION: 50% bottom; BORDER-TOP: #ccc 1px solid; PADDING-LEFT: 6px; FONT-WEIGHT: bold; PADDING-BOTTOM: 2px; BORDER-LEFT: #ccc 1px solid; COLOR: rgb(66,97,222); MARGIN-RIGHT: 3px; PADDING-TOP: 2px; BORDER-BOTTOM: #ccc 1px solid; TEXT-DECORATION: none} DIV.technorati A:hover { BACKGROUND-IMAGE: none; COLOR: #fff; BACKGROUND-COLOR: #4261df} DIV.technorati A:active { BACKGROUND-IMAGE: none; COLOR: #fff; BACKGROUND-COLOR: #4261df} DIV.technorati SPAN.current { PADDING-RIGHT: 6px; PADDING-LEFT: 6px; FONT-WEIGHT: bold; PADDING-BOTTOM: 2px; COLOR: #000; MARGIN-RIGHT: 3px; PADDING-TOP: 2px} DIV.technorati SPAN.disabled { DISPLAY: none}

HTML：

<P>Yellow Style <DIV class=yellow><SPAN class=disabled>< </SPAN><SPAN class=current>1</SPAN> <A href="#?page=2" mce_href="#?page=2">2</A><A href="#?page=3" mce_href="#?page=3">3</A><A href="#?page=4" mce_href="#?page=4">4</A> <A href="#?page=5" mce_href="#?page=5">5</A><A href="#?page=6" mce_href="#?page=6">6</A><A href="#?page=7" mce_href="#?page=7">7</A>... <A href="#?page=199" mce_href="#?page=199">199</A><A href="#?page=200" mce_href="#?page=200">200</A><A href="#?page=2" mce_href="#?page=2"> > </A> </DIV> <P></P> <P>jogger Style <DIV class=jogger><SPAN class=disabled>< </SPAN><SPAN class=current>1</SPAN> <A href="#?page=2" mce_href="#?page=2">2</A><A href="#?page=3" mce_href="#?page=3">3</A><A href="#?page=4" mce_href="#?page=4">4</A> <A href="#?page=5" mce_href="#?page=5">5</A><A href="#?page=6" mce_href="#?page=6">6</A><A href="#?page=7" mce_href="#?page=7">7</A>... <A href="#?page=199" mce_href="#?page=199">199</A><A href="#?page=200" mce_href="#?page=200">200</A><A href="#?page=2" mce_href="#?page=2"> > </A> </DIV> <P></P> <P>starcraft 2 Style <DIV class=starcraft2><SPAN class=disabled>< </SPAN><SPAN class=current>1</SPAN> <A href="#?page=2" mce_href="#?page=2">2</A><A href="#?page=3" mce_href="#?page=3">3</A><A href="#?page=4" mce_href="#?page=4">4</A> <A href="#?page=5" mce_href="#?page=5">5</A><A href="#?page=6" mce_href="#?page=6">6</A><A href="#?page=7" mce_href="#?page=7">7</A>... <A href="#?page=199" mce_href="#?page=199">199</A><A href="#?page=200" mce_href="#?page=200">200</A><A href="#?page=2" mce_href="#?page=2"> > </A> </DIV> <P></P> <P>Tres Style <DIV class=tres><SPAN class=disabled>< </SPAN><SPAN class=current>1</SPAN> <A href="#?page=2" mce_href="#?page=2">2</A><A href="#?page=3" mce_href="#?page=3">3</A><A href="#?page=4" mce_href="#?page=4">4</A> <A href="#?page=5" mce_href="#?page=5">5</A><A href="#?page=6" mce_href="#?page=6">6</A><A href="#?page=7" mce_href="#?page=7">7</A>... <A href="#?page=199" mce_href="#?page=199">199</A><A href="#?page=200" mce_href="#?page=200">200</A><A href="#?page=2" mce_href="#?page=2"> > </A> </DIV> <P></P> <P>512megas Style <DIV class=megas512><SPAN class=disabled>< </SPAN><SPAN class=current>1</SPAN> <A href="#?page=2" mce_href="#?page=2">2</A><A href="#?page=3" mce_href="#?page=3">3</A><A href="#?page=4" mce_href="#?page=4">4</A> <A href="#?page=5" mce_href="#?page=5">5</A><A href="#?page=6" mce_href="#?page=6">6</A><A href="#?page=7" mce_href="#?page=7">7</A>... <A href="#?page=199" mce_href="#?page=199">199</A><A href="#?page=200" mce_href="#?page=200">200</A><A href="#?page=2" mce_href="#?page=2"> > </A> </DIV> <P></P> <P>Technorati Style <DIV class=technorati><SPAN class=disabled>< </SPAN><SPAN class=current>1</SPAN> <A href="#?page=2" mce_href="#?page=2">2</A><A href="#?page=3" mce_href="#?page=3">3</A><A href="#?page=4" mce_href="#?page=4">4</A> <A href="#?page=5" mce_href="#?page=5">5</A><A href="#?page=6" mce_href="#?page=6">6</A><A href="#?page=7" mce_href="#?page=7">7</A>... <A href="#?page=199" mce_href="#?page=199">199</A><A href="#?page=200" mce_href="#?page=200">200</A><A href="#?page=2" mce_href="#?page=2"> > </A> </DIV> <h3 align="right">www.865171.cn</h3>

 

 

 

 

 

CSS：

BODY { FONT-SIZE: 12px;FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif; WIDTH: 60%; PADDING-LEFT: 25px;} DIV.scott { PADDING-RIGHT: 3px; PADDING-LEFT: 3px; PADDING-BOTTOM: 3px; MARGIN: 3px; PADDING-TOP: 3px; TEXT-ALIGN: center} DIV.scott A { BORDER-RIGHT: #ddd 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #ddd 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 2px; BORDER-LEFT: #ddd 1px solid; COLOR: #88af3f; MARGIN-RIGHT: 2px; PADDING-TOP: 2px; BORDER-BOTTOM: #ddd 1px solid; TEXT-DECORATION: none} DIV.scott A:hover { BORDER-RIGHT: #85bd1e 1px solid; BORDER-TOP: #85bd1e 1px solid; BORDER-LEFT: #85bd1e 1px solid; COLOR: #638425; BORDER-BOTTOM: #85bd1e 1px solid; BACKGROUND-COLOR: #f1ffd6} DIV.scott A:active { BORDER-RIGHT: #85bd1e 1px solid; BORDER-TOP: #85bd1e 1px solid; BORDER-LEFT: #85bd1e 1px solid; COLOR: #638425; BORDER-BOTTOM: #85bd1e 1px solid; BACKGROUND-COLOR: #f1ffd6} DIV.scott SPAN.current { BORDER-RIGHT: #b2e05d 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #b2e05d 1px solid; PADDING-LEFT: 5px; FONT-WEIGHT: bold; PADDING-BOTTOM: 2px; BORDER-LEFT: #b2e05d 1px solid; COLOR: #fff; MARGIN-RIGHT: 2px; PADDING-TOP: 2px; BORDER-BOTTOM: #b2e05d 1px solid; BACKGROUND-COLOR: #b2e05d} DIV.scott SPAN.disabled { BORDER-RIGHT: #f3f3f3 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #f3f3f3 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 2px; BORDER-LEFT: #f3f3f3 1px solid; COLOR: #ccc; MARGIN-RIGHT: 2px; PADDING-TOP: 2px; BORDER-BOTTOM: #f3f3f3 1px solid} DIV.quotes { PADDING-RIGHT: 3px; PADDING-LEFT: 3px; PADDING-BOTTOM: 3px; MARGIN: 3px; PADDING-TOP: 3px; TEXT-ALIGN: center} DIV.quotes A { BORDER-RIGHT: #ddd 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #ddd 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 2px; BORDER-LEFT: #ddd 1px solid; COLOR: #aaa; MARGIN-RIGHT: 2px; PADDING-TOP: 2px; BORDER-BOTTOM: #ddd 1px solid; TEXT-DECORATION: none} DIV.quotes A:hover { BORDER-RIGHT: #a0a0a0 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #a0a0a0 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 2px; BORDER-LEFT: #a0a0a0 1px solid; MARGIN-RIGHT: 2px; PADDING-TOP: 2px; BORDER-BOTTOM: #a0a0a0 1px solid} DIV.quotes A:active { BORDER-RIGHT: #a0a0a0 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #a0a0a0 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 2px; BORDER-LEFT: #a0a0a0 1px solid; MARGIN-RIGHT: 2px; PADDING-TOP: 2px; BORDER-BOTTOM: #a0a0a0 1px solid} DIV.quotes SPAN.current { BORDER-RIGHT: #e0e0e0 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #e0e0e0 1px solid; PADDING-LEFT: 5px; FONT-WEIGHT: bold; PADDING-BOTTOM: 2px; BORDER-LEFT: #e0e0e0 1px solid; COLOR: #aaa; MARGIN-RIGHT: 2px; PADDING-TOP: 2px; BORDER-BOTTOM: #e0e0e0 1px solid; BACKGROUND-COLOR: #f0f0f0} DIV.quotes SPAN.disabled { BORDER-RIGHT: #f3f3f3 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #f3f3f3 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 2px; BORDER-LEFT: #f3f3f3 1px solid; COLOR: #ccc; MARGIN-RIGHT: 2px; PADDING-TOP: 2px; BORDER-BOTTOM: #f3f3f3 1px solid} DIV.black { PADDING-RIGHT: 3px; PADDING-LEFT: 3px; FONT-SIZE: 80%; PADDING-BOTTOM: 10px; MARGIN: 3px; COLOR: #a0a0a0; PADDING-TOP: 10px; BACKGROUND-COLOR: #000; TEXT-ALIGN: center} DIV.black A { BORDER-RIGHT: #909090 1px solid; PADDING-RIGHT: 5px; BACKGROUND-POSITION: 50% bottom; BORDER-TOP: #909090 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 2px; BORDER-LEFT: #909090 1px solid; COLOR: #c0c0c0; MARGIN-RIGHT: 3px; PADDING-TOP: 2px; BORDER-BOTTOM: #909090 1px solid; TEXT-DECORATION: none} DIV.black A:hover { BORDER-RIGHT: #f0f0f0 1px solid; BORDER-TOP: #f0f0f0 1px solid; BACKGROUND-IMAGE: url(invbar.gif); BORDER-LEFT: #f0f0f0 1px solid; COLOR: #ffffff; BORDER-BOTTOM: #f0f0f0 1px solid; BACKGROUND-COLOR: #404040} DIV.black A:active { BORDER-RIGHT: #f0f0f0 1px solid; BORDER-TOP: #f0f0f0 1px solid; BACKGROUND-COLOR: #404040; BORDER-LEFT: #f0f0f0 1px solid; COLOR: #ffffff; BORDER-BOTTOM: #f0f0f0 1px solid; } DIV.black SPAN.current { BORDER-RIGHT: #ffffff 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #ffffff 1px solid; PADDING-LEFT: 5px; FONT-WEIGHT: bold; PADDING-BOTTOM: 2px; BORDER-LEFT: #ffffff 1px solid; COLOR: #ffffff; MARGIN-RIGHT: 3px; PADDING-TOP: 2px; BORDER-BOTTOM: #ffffff 1px solid; BACKGROUND-COLOR: #606060} DIV.black SPAN.disabled { BORDER-RIGHT: #606060 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #606060 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 2px; BORDER-LEFT: #606060 1px solid; COLOR: #808080; MARGIN-RIGHT: 3px; PADDING-TOP: 2px; BORDER-BOTTOM: #606060 1px solid} DIV.black2 { PADDING-RIGHT: 7px; PADDING-LEFT: 7px; PADDING-BOTTOM: 7px; MARGIN: 3px; PADDING-TOP: 7px; TEXT-ALIGN: center} DIV.black2 A { BORDER-RIGHT: #000000 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #000000 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 2px; MARGIN: 2px; BORDER-LEFT: #000000 1px solid; COLOR: #000000; PADDING-TOP: 2px; BORDER-BOTTOM: #000000 1px solid; TEXT-DECORATION: none} DIV.black2 A:hover { BORDER-RIGHT: #000000 1px solid; BORDER-TOP: #000000 1px solid; BORDER-LEFT: #000000 1px solid; COLOR: #fff; BORDER-BOTTOM: #000000 1px solid; BACKGROUND-COLOR: #000} DIV.black2 A:active { BORDER-RIGHT: #000000 1px solid; BORDER-TOP: #000000 1px solid; BORDER-LEFT: #000000 1px solid; COLOR: #fff; BORDER-BOTTOM: #000000 1px solid; BACKGROUND-COLOR: #000} DIV.black2 SPAN.current { BORDER-RIGHT: #000000 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #000000 1px solid; PADDING-LEFT: 5px; FONT-WEIGHT: bold; PADDING-BOTTOM: 2px; MARGIN: 2px; BORDER-LEFT: #000000 1px solid; COLOR: #fff; PADDING-TOP: 2px; BORDER-BOTTOM: #000000 1px solid; BACKGROUND-COLOR: #000000} DIV.black2 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} DIV.black-red { FONT-SIZE: 11px; COLOR: #fff; FONT-FAMILY: Tahoma, Arial, Helvetica, Sans-serif; BACKGROUND-COLOR: #3e3e3e} DIV.black-red A { PADDING-RIGHT: 5px; PADDING-LEFT: 5px; PADDING-BOTTOM: 2px; MARGIN: 2px; COLOR: #fff; PADDING-TOP: 2px; BACKGROUND-COLOR: #3e3e3e; TEXT-DECORATION: none} DIV.black-red A:hover { COLOR: #fff; BACKGROUND-COLOR: #ec5210} DIV.black-red A:active { COLOR: #fff; BACKGROUND-COLOR: #ec5210} DIV.black-red SPAN.current { PADDING-RIGHT: 5px; PADDING-LEFT: 5px; FONT-WEIGHT: bold; PADDING-BOTTOM: 2px; MARGIN: 2px; COLOR: #fff; PADDING-TOP: 2px; BACKGROUND-COLOR: #313131} DIV.black-red SPAN.disabled { PADDING-RIGHT: 5px; PADDING-LEFT: 5px; PADDING-BOTTOM: 2px; MARGIN: 2px; COLOR: #868686; PADDING-TOP: 2px; BACKGROUND-COLOR: #3e3e3e} DIV.grayr { PADDING-RIGHT: 2px; PADDING-LEFT: 2px; FONT-SIZE: 11px; PADDING-BOTTOM: 2px; PADDING-TOP: 2px; FONT-FAMILY: Tahoma, Arial, Helvetica, Sans-serif; BACKGROUND-COLOR: #c1c1c1} DIV.grayr A { PADDING-RIGHT: 5px; PADDING-LEFT: 5px; PADDING-BOTTOM: 2px; MARGIN: 2px; COLOR: #000; PADDING-TOP: 2px; BACKGROUND-COLOR: #c1c1c1; TEXT-DECORATION: none} DIV.grayr A:hover { COLOR: #000; BACKGROUND-COLOR: #99ffff} DIV.grayr A:active { COLOR: #000; BACKGROUND-COLOR: #99ffff} DIV.grayr SPAN.current { PADDING-RIGHT: 5px; PADDING-LEFT: 5px; FONT-WEIGHT: bold; PADDING-BOTTOM: 2px; MARGIN: 2px; COLOR: #303030; PADDING-TOP: 2px; BACKGROUND-COLOR: #fff} DIV.grayr SPAN.disabled { PADDING-RIGHT: 5px; PADDING-LEFT: 5px; PADDING-BOTTOM: 2px; MARGIN: 2px; COLOR: #797979; PADDING-TOP: 2px; BACKGROUND-COLOR: #c1c1c1}

HTML：

<P>Green Style <DIV class=scott><SPAN class=disabled>< </SPAN><SPAN class=current>1</SPAN> <A href="#?page=2" mce_href="#?page=2">2</A><A href="#?page=3" mce_href="#?page=3">3</A><A href="#?page=4" mce_href="#?page=4">4</A> <A href="#?page=5" mce_href="#?page=5">5</A><A href="#?page=6" mce_href="#?page=6">6</A><A href="#?page=7" mce_href="#?page=7">7</A>... <A href="#?page=199" mce_href="#?page=199">199</A><A href="#?page=200" mce_href="#?page=200">200</A><A href="#?page=2" mce_href="#?page=2"> > </A> </DIV> <P></P> <P>Gray Style <DIV class=quotes><SPAN class=disabled>< </SPAN><SPAN class=current>1</SPAN> <A href="#?page=2" mce_href="#?page=2">2</A><A href="#?page=3" mce_href="#?page=3">3</A><A href="#?page=4" mce_href="#?page=4">4</A> <A href="#?page=5" mce_href="#?page=5">5</A><A href="#?page=6" mce_href="#?page=6">6</A><A href="#?page=7" mce_href="#?page=7">7</A>... <A href="#?page=199" mce_href="#?page=199">199</A><A href="#?page=200" mce_href="#?page=200">200</A><A href="#?page=2" mce_href="#?page=2"> > </A> </DIV> <P></P> <P>Black Style <DIV class=black><SPAN class=disabled>< </SPAN><SPAN class=current>1</SPAN> <A href="#?page=2" mce_href="#?page=2">2</A><A href="#?page=3" mce_href="#?page=3">3</A><A href="#?page=4" mce_href="#?page=4">4</A> <A href="#?page=5" mce_href="#?page=5">5</A><A href="#?page=6" mce_href="#?page=6">6</A><A href="#?page=7" mce_href="#?page=7">7</A>... <A href="#?page=199" mce_href="#?page=199">199</A><A href="#?page=200" mce_href="#?page=200">200</A><A href="#?page=2" mce_href="#?page=2"> > </A> </DIV> <P></P> <P>Mis Algoritmos Style <DIV class=black2><SPAN class=disabled>< </SPAN><SPAN class=current>1</SPAN> <A href="#?page=2" mce_href="#?page=2">2</A><A href="#?page=3" mce_href="#?page=3">3</A><A href="#?page=4" mce_href="#?page=4">4</A> <A href="#?page=5" mce_href="#?page=5">5</A><A href="#?page=6" mce_href="#?page=6">6</A><A href="#?page=7" mce_href="#?page=7">7</A>... <A href="#?page=199" mce_href="#?page=199">199</A><A href="#?page=200" mce_href="#?page=200">200</A><A href="#?page=2" mce_href="#?page=2"> > </A> </DIV> <P></P> <P>Black-Red Style <DIV style="PADDING-BOTTOM: 10px; PADDING-TOP: 10px; BACKGROUND-COLOR: #313131" mce_style="PADDING-BOTTOM: 10px; PADDING-TOP: 10px; BACKGROUND-COLOR: #313131"> <DIV class=black-red><SPAN class=disabled>< </SPAN><SPAN class=current>1</SPAN> <A href="#?page=2" mce_href="#?page=2">2</A><A href="#?page=3" mce_href="#?page=3">3</A><A href="#?page=4" mce_href="#?page=4">4</A> <A href="#?page=5" mce_href="#?page=5">5</A><A href="#?page=6" mce_href="#?page=6">6</A><A href="#?page=7" mce_href="#?page=7">7</A>... <A href="#?page=199" mce_href="#?page=199">199</A><A href="#?page=200" mce_href="#?page=200">200</A><A href="#?page=2" mce_href="#?page=2"> > </A> </DIV></DIV> <P></P> <P>Gray Style 2 <DIV class=grayr><SPAN class=disabled>< </SPAN><SPAN class=current>1</SPAN> <A href="#?page=2" mce_href="#?page=2">2</A><A href="#?page=3" mce_href="#?page=3">3</A><A href="#?page=4" mce_href="#?page=4">4</A> <A href="#?page=5" mce_href="#?page=5">5</A><A href="#?page=6" mce_href="#?page=6">6</A><A href="#?page=7" mce_href="#?page=7">7</A>... <A href="#?page=199" mce_href="#?page=199">199</A><A href="#?page=200" mce_href="#?page=200">200</A><A href="#?page=2" mce_href="#?page=2"> > </A> </DIV> <h3 align="right">www.865171.cn</h3>

 

 

 

 

 

 

 

 

CSS：

BODY { FONT-SIZE: 12px;FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif; WIDTH: 60%; PADDING-LEFT: 25px;} DIV.digg { PADDING-RIGHT: 3px; PADDING-LEFT: 3px; PADDING-BOTTOM: 3px; MARGIN: 3px; PADDING-TOP: 3px; TEXT-ALIGN: center} DIV.digg A { BORDER-RIGHT: #aaaadd 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #aaaadd 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 2px; MARGIN: 2px; BORDER-LEFT: #aaaadd 1px solid; COLOR: #000099; PADDING-TOP: 2px; BORDER-BOTTOM: #aaaadd 1px solid; TEXT-DECORATION: none} DIV.digg 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.digg A:active { BORDER-RIGHT: #000099 1px solid; BORDER-TOP: #000099 1px solid; BORDER-LEFT: #000099 1px solid; COLOR: #000; BORDER-BOTTOM: #000099 1px solid} DIV.digg SPAN.current { BORDER-RIGHT: #000099 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #000099 1px solid; PADDING-LEFT: 5px; FONT-WEIGHT: bold; PADDING-BOTTOM: 2px; MARGIN: 2px; BORDER-LEFT: #000099 1px solid; COLOR: #fff; PADDING-TOP: 2px; BORDER-BOTTOM: #000099 1px solid; BACKGROUND-COLOR: #000099} DIV.digg 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} DIV.yahoo { PADDING-RIGHT: 3px; PADDING-LEFT: 3px; PADDING-BOTTOM: 3px; MARGIN: 3px; PADDING-TOP: 3px; TEXT-ALIGN: center} DIV.yahoo 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.yahoo 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.yahoo 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.yahoo 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.yahoo 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} DIV.meneame { PADDING-RIGHT: 3px; PADDING-LEFT: 3px; FONT-SIZE: 80%; PADDING-BOTTOM: 3px; MARGIN: 3px; COLOR: #ff6500; PADDING-TOP: 3px; TEXT-ALIGN: center} DIV.meneame A { BORDER-RIGHT: #ff9600 1px solid; PADDING-RIGHT: 7px; BACKGROUND-POSITION: 50% bottom; BORDER-TOP: #ff9600 1px solid; PADDING-LEFT: 7px; TEXT-DECORATION: none; PADDING-BOTTOM: 5px; BORDER-LEFT: #ff9600 1px solid; COLOR: #ff6500; MARGIN-RIGHT: 3px; PADDING-TOP: 5px; BORDER-BOTTOM: #ff9600 1px solid; } DIV.meneame A:hover { BORDER-RIGHT: #ff9600 1px solid; BORDER-TOP: #ff9600 1px solid; BACKGROUND-IMAGE: none; BORDER-LEFT: #ff9600 1px solid; COLOR: #ff6500; BORDER-BOTTOM: #ff9600 1px solid; BACKGROUND-COLOR: #ffc794} DIV.meneame A:active { BORDER-RIGHT: #ff9600 1px solid; BORDER-TOP: #ff9600 1px solid; BACKGROUND-IMAGE: none; BORDER-LEFT: #ff9600 1px solid; COLOR: #ff6500; BORDER-BOTTOM: #ff9600 1px solid; BACKGROUND-COLOR: #ffc794} DIV.meneame SPAN.current { BORDER-RIGHT: #ff6500 1px solid; PADDING-RIGHT: 7px; BORDER-TOP: #ff6500 1px solid; PADDING-LEFT: 7px; FONT-WEIGHT: bold; PADDING-BOTTOM: 5px; BORDER-LEFT: #ff6500 1px solid; COLOR: #ff6500; MARGIN-RIGHT: 3px; PADDING-TOP: 5px; BORDER-BOTTOM: #ff6500 1px solid; BACKGROUND-COLOR: #ffbe94} DIV.meneame SPAN.disabled { BORDER-RIGHT: #ffe3c6 1px solid; PADDING-RIGHT: 7px; BORDER-TOP: #ffe3c6 1px solid; PADDING-LEFT: 7px; PADDING-BOTTOM: 5px; BORDER-LEFT: #ffe3c6 1px solid; COLOR: #ffe3c6; MARGIN-RIGHT: 3px; PADDING-TOP: 5px; BORDER-BOTTOM: #ffe3c6 1px solid} DIV.flickr { PADDING-RIGHT: 3px; PADDING-LEFT: 3px; PADDING-BOTTOM: 3px; MARGIN: 3px; PADDING-TOP: 3px; TEXT-ALIGN: center} DIV.flickr A { BORDER-RIGHT: #dedfde 1px solid; PADDING-RIGHT: 6px; BACKGROUND-POSITION: 50% bottom; BORDER-TOP: #dedfde 1px solid; PADDING-LEFT: 6px; PADDING-BOTTOM: 2px; BORDER-LEFT: #dedfde 1px solid; COLOR: #0061de; MARGIN-RIGHT: 3px; PADDING-TOP: 2px; BORDER-BOTTOM: #dedfde 1px solid; TEXT-DECORATION: none} DIV.flickr A:hover { BORDER-RIGHT: #000 1px solid; BORDER-TOP: #000 1px solid; BACKGROUND-IMAGE: none; BORDER-LEFT: #000 1px solid; COLOR: #fff; BORDER-BOTTOM: #000 1px solid; BACKGROUND-COLOR: #0061de} DIV.meneame A:active { BORDER-RIGHT: #000 1px solid; BORDER-TOP: #000 1px solid; BACKGROUND-IMAGE: none; BORDER-LEFT: #000 1px solid; COLOR: #fff; BORDER-BOTTOM: #000 1px solid; BACKGROUND-COLOR: #0061de} DIV.flickr SPAN.current { PADDING-RIGHT: 6px; PADDING-LEFT: 6px; FONT-WEIGHT: bold; PADDING-BOTTOM: 2px; COLOR: #ff0084; MARGIN-RIGHT: 3px; PADDING-TOP: 2px} DIV.flickr SPAN.disabled { PADDING-RIGHT: 6px; PADDING-LEFT: 6px; PADDING-BOTTOM: 2px; COLOR: #adaaad; MARGIN-RIGHT: 3px; PADDING-TOP: 2px} DIV.sabrosus { PADDING-RIGHT: 3px; PADDING-LEFT: 3px; PADDING-BOTTOM: 3px; MARGIN: 3px; PADDING-TOP: 3px; TEXT-ALIGN: center} DIV.sabrosus A { BORDER-RIGHT: #9aafe5 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #9aafe5 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 2px; BORDER-LEFT: #9aafe5 1px solid; COLOR: #2e6ab1; MARGIN-RIGHT: 2px; PADDING-TOP: 2px; BORDER-BOTTOM: #9aafe5 1px solid; TEXT-DECORATION: none} DIV.sabrosus A:hover { BORDER-RIGHT: #2b66a5 1px solid; BORDER-TOP: #2b66a5 1px solid; BORDER-LEFT: #2b66a5 1px solid; COLOR: #000; BORDER-BOTTOM: #2b66a5 1px solid; BACKGROUND-COLOR: lightyellow} DIV.pagination A:active { BORDER-RIGHT: #2b66a5 1px solid; BORDER-TOP: #2b66a5 1px solid; BORDER-LEFT: #2b66a5 1px solid; COLOR: #000; BORDER-BOTTOM: #2b66a5 1px solid; BACKGROUND-COLOR: lightyellow} DIV.sabrosus SPAN.current { BORDER-RIGHT: navy 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: navy 1px solid; PADDING-LEFT: 5px; FONT-WEIGHT: bold; PADDING-BOTTOM: 2px; BORDER-LEFT: navy 1px solid; COLOR: #fff; MARGIN-RIGHT: 2px; PADDING-TOP: 2px; BORDER-BOTTOM: navy 1px solid; BACKGROUND-COLOR: #2e6ab1} DIV.sabrosus SPAN.disabled { BORDER-RIGHT: #929292 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #929292 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 2px; BORDER-LEFT: #929292 1px solid; COLOR: #929292; MARGIN-RIGHT: 2px; PADDING-TOP: 2px; BORDER-BOTTOM: #929292 1px solid}

 

HTML：

<P>Digg Style <DIV class=digg><SPAN class=disabled>< </SPAN><SPAN class=current>1</SPAN> <A href="#?page=2" mce_href="#?page=2">2</A><A href="#?page=3" mce_href="#?page=3">3</A><A href="#?page=4" mce_href="#?page=4">4</A> <A href="#?page=5" mce_href="#?page=5">5</A><A href="#?page=6" mce_href="#?page=6">6</A><A href="#?page=7" mce_href="#?page=7">7</A>... <A href="#?page=199" mce_href="#?page=199">199</A><A href="#?page=200" mce_href="#?page=200">200</A><A href="#?page=2" mce_href="#?page=2"> > </A> </DIV> <P></P> <P>Yahoo Style <DIV class=yahoo><SPAN class=disabled>< </SPAN><SPAN class=current>1</SPAN> <A href="#?page=2" mce_href="#?page=2">2</A><A href="#?page=3" mce_href="#?page=3">3</A><A href="#?page=4" mce_href="#?page=4">4</A> <A href="#?page=5" mce_href="#?page=5">5</A><A href="#?page=6" mce_href="#?page=6">6</A><A href="#?page=7" mce_href="#?page=7">7</A>... <A href="#?page=199" mce_href="#?page=199">199</A><A href="#?page=200" mce_href="#?page=200">200</A><A href="#?page=2" mce_href="#?page=2"> > </A> </DIV> <P></P> <P>New Yahoo! Style <DIV class=yahoo2><SPAN class=disabled>< Prev</SPAN><SPAN class=current>1</SPAN> <A href="#?page=2" mce_href="#?page=2">2</A><A href="#?page=3" mce_href="#?page=3">3</A><A href="#?page=4" mce_href="#?page=4">4</A> <A href="#?page=5" mce_href="#?page=5">5</A><A href="#?page=6" mce_href="#?page=6">6</A><A href="#?page=7" mce_href="#?page=7">7</A>... <A href="#?page=199" mce_href="#?page=199">199</A><A href="#?page=200" mce_href="#?page=200">200</A><A href="#?page=2" mce_href="#?page=2">Next ></A> </DIV> <P></P> <P>Meneame Style <DIV class=meneame><SPAN class=disabled>< </SPAN><SPAN class=current>1</SPAN> <A href="#?page=2" mce_href="#?page=2">2</A><A href="#?page=3" mce_href="#?page=3">3</A><A href="#?page=4" mce_href="#?page=4">4</A> <A href="#?page=5" mce_href="#?page=5">5</A><A href="#?page=6" mce_href="#?page=6">6</A><A href="#?page=7" mce_href="#?page=7">7</A>... <A href="#?page=199" mce_href="#?page=199">199</A><A href="#?page=200" mce_href="#?page=200">200</A><A href="#?page=2" mce_href="#?page=2"> > </A> </DIV> <P></P> <P>Flickr Style <DIV class=flickr><SPAN class=disabled>< </SPAN><SPAN class=current>1</SPAN> <A href="#?page=2" mce_href="#?page=2">2</A><A href="#?page=3" mce_href="#?page=3">3</A><A href="#?page=4" mce_href="#?page=4">4</A> <A href="#?page=5" mce_href="#?page=5">5</A><A href="#?page=6" mce_href="#?page=6">6</A><A href="#?page=7" mce_href="#?page=7">7</A>... <A href="#?page=199" mce_href="#?page=199">199</A><A href="#?page=200" mce_href="#?page=200">200</A><A href="#?page=2" mce_href="#?page=2"> > </A> </DIV> <P></P> <P>Sabros.us Style <DIV class=sabrosus><SPAN class=disabled>< </SPAN><SPAN class=current>1</SPAN> <A href="#?page=2" mce_href="#?page=2">2</A><A href="#?page=3" mce_href="#?page=3">3</A><A href="#?page=4" mce_href="#?page=4">4</A> <A href="#?page=5" mce_href="#?page=5">5</A><A href="#?page=6" mce_href="#?page=6">6</A><A href="#?page=7" mce_href="#?page=7">7</A>... <A href="#?page=199" mce_href="#?page=199">199</A><A href="#?page=200" mce_href="#?page=200">200</A><A href="#?page=2" mce_href="#?page=2"> > </A> </DIV> <h3 align="right">www.865171.cn</h3>