1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>翻页</title> 6 <style type="text/css"> 7 .con{ 8 width: 600px; 9 height: 40px; 10 border: 1px solid #666; 11 margin: 50px auto 0; 12 text-align: center; 13 } 14 .con a{ 15 height: 26px; 16 text-decoration: none; 17 background-color: gold; 18 line-height: 40px; 19 font-size: 12px; 20 color: black; 21 font-family: 'Microsoft Yahei' 22 display: inline-block; 23 padding: 0px 7px; 24 margin: 5px; 25 } 26 27 .con a:hover{ 28 color: #fff; 29 } 30 31 </style> 32 </head> 33 <body> 34 <div class="con"> 35 <a href="#">上一页</a> 36 <a href="#">11</a> 37 <a href="#">2</a> 38 <a href="#">3</a> 39 <a href="#">4</a> 40 <span href="#">···</span> 41 <a href="#">17</a> 42 <a href="#">18</a> 43 <a href="#">19</a> 44 <a href="#">20</a> 45 <a href="#">下一页</a> 46 </div> 47 </body> 48 </html>