页码制作

Posted 喵小娇

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了页码制作相关的知识,希望对你有一定的参考价值。

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>页码</title>
 6     <style>
 7         .page {
 8             width: 600px;
 9             height: 60px;
10             background: lavender;
11             margin: 90px auto;
12             text-align: center;
13         }
14 
15         .page a {
16             height: 28px;
17             line-height: 28px;
18             display: inline-block;
19             background: #fff;
20             border: 1px solid darkgrey;
21             text-decoration: none;
22             color: #333;
23             padding: 0 8px 0 9px;
24         }
25 
26         .page a:hover {
27             border-color: red;
28             color: red;
29         }
30 
31         .page .active{
32             font-weight: bold;
33             background: #fcf9ea;
34             cursor: text;
35         }
36 
37         .page .active:hover{
38             border-color: #cdcdcd;
39             color: #333;
40         }
41 
42     </style>
43 </head>
44 <body>
45 <div class="page">
46     <a href="#">上一页</a>
47     <a href="#">1</a>
48     <a href="#">2</a>
49     <a href="#">3</a>
50     <a href="#">4</a>
51     <a class="active" href="#">5</a>
52     <a href="#">12</a>
53     <a href="#">76</a>
54     <a href="#">342</a>
55     <a href="#">下一页</a>
56 </div>
57 </body>
58 </html>

 

以上是关于页码制作的主要内容,如果未能解决你的问题,请参考以下文章

已制作好的Word文档里面的页码,显示{PAGE},不显示数字,怎么解决?

在使用WORD时,需要制作一个关键词和页码的索引页面。请问如何根据关键词速查出其所在的页码?

飞页效果,可以制作页码更换

页码制作

直角页码制作

关于分页页码制作