css分页居中/圆角宽度自适应实现_襄阳云动网络科技有限公司

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <FCK:meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>分页居中/圆角宽度自适应-<a href=http://www.xyydw.com target=_blank class=infotextkey>云动网络</a></title> <style type="text/css"> *{margin:0; padding:0;} body{padding:20px; text-align:center;} .cutpage{font-size:12px; font-family:Tahoma;} .cutpage a{display:inline-block; background:url(http://www.lanrentuku.com/down/js/images/13255921110.png) left top no-repeat; height:17px; padding-left:5px; line-height:17px; text-decoration:none; margin:3px 3px 3px 0; vertical-align:middle;} .cutpage a span{ background:url(http://www.lanrentuku.com/down/js/images/13255921110.png) right top no-repeat; padding-right:5px; display:inline-block; cursor:pointer; height:17px; line-height:17px;} .cutpage a.current{background:url(http://www.lanrentuku.com/down/js/images/13255921110.png) left -17px no-repeat;} .cutpage a.current span{background:url(http://www.lanrentuku.com/down/js/images/13255921110.png) right -17px no-repeat;} .cutpage a:link,.cutpage a:visited{color:#999;} .cutpage a:hover{background-position:left -17px; color:#fff;} .cutpage a.current:hover{color:#fff;} .cutpage a:hover span{background-position:right -17px;} .cutpage a.current:link,.cutpage a.current:visited{color:#fff;} </style> </head> <body> <div style="width:300px; margin:0 auto;"> <div class="cutpage" id="page"> <a href="#" _fcksavedurl="#">上一页</a><a href="#" _fcksavedurl="#" class="current" id="cutpage">1</a><a href="#" _fcksavedurl="#">2</a><a href="#" _fcksavedurl="#">3</a><a href="#" _fcksavedurl="#">4</a><a href="#" _fcksavedurl="#">3</a><a href="#" _fcksavedurl="#">4</a><a href="#" _fcksavedurl="#">5</a><a href="#" _fcksavedurl="#">6</a><a href="#" _fcksavedurl="#">7</a><a href="#" _fcksavedurl="#">8</a><a href="#" _fcksavedurl="#">9</a><a href="#" _fcksavedurl="#">10</a><a href="#" _fcksavedurl="#">11</a><a href="#" _fcksavedurl="#">14</a><a href="#" _fcksavedurl="#">124</a><a href="#" _fcksavedurl="#">下一页</a> </div> </div> </body> </html>

【打印】【关闭】

您当前的位置：首页 > 前端开发 > css技术 css技术

css分页居中/圆角宽度自适应实现

相关阅读