| Web page Production WEBJX article introduction: ! DOCTYPE HTML Public-//w3c//dtd XHTML 1.0 transitional//en http://www.w3.org/TR/xhtml1/DTD/ xhtml1-transitional.dtdhtml Xmlns=http://www.w3.org/1999/xhtmlheadmeta Http-equiv=content-type content=text/html; Charset=gb2312/titlediv CSS Example: a good |
<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd "> <ptml xmlns=" http://www.w3.org/1999/xhtml "> <pead> <meta http-equiv=" Content-type "content=" text/html; charset=gb2312 "/> <title>div CSS instance: a good CSS paging effect (DIGG) </title> <style type=" Text/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} </style> <body> <p> <a href= "/" _fcksavedurl= "/" >digg Style-webs book.com</a> <div class= "Digg" > <span class= "Disabled" > < </span> <span class= "current" >1</span> <a href= "#?page=2" _fcksavedurl="#?page=2" >2</a> <a href= "#?page=3" _fcksavedurl= "#?page=3" >3</a> <a href= "#?page=4" _ Fcksavedurl= "#?page=4" >4</a> <a href= "#?page=5" _fcksavedurl= "#?page=5" >5</a> <a href= "#? Page=6 "_fcksavedurl=" #?page=6 >6</a> <a href= "#?page=7" _fcksavedurl= "#?page=7" >7</a> ... < A href= "#?page=199" _fcksavedurl= "#?page=199" >199</a> <a href= "#?page=200" _fcksavedurl= "#?page=200" >200</a> <a href= "#?page=2" _fcksavedurl= "#?page=2" > > </a> </div> </p> </body > </ptml>
Tip: You can modify some of the code before running
