第四十三节 特征布局案列翻页 

 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>

 

posted @ 2020-03-05 23:30  kog_maw  阅读(104)  评论(0)    收藏  举报