HTML简单页面页码的设计
<!DOCTYPE HTML>
<html>
<head>
<title>HTML页码设置</title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
<style type="text/css">
.page-nav{
height: 60px;
width:100%;
line-height: 60px;
text-align: center;
overflow: hidden;
}
.page-nav>ul{
overflow: hidden;
margin: 0 30%;
width:80%;
}
.page-nav>ul>li{
float: left;
list-style-type: none;
margin-right:20px;
}
</style>
</head>
<body>
<div class='page-nav'>
<ul>
<li><a href="#">首页</a></li>
<li><a href="#">上一页</a></li>
<li><a href="#">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li><a href="#">5</a></li>
<li><a href="#">下一页</a></li>
<li><a href="#">末页</a></li>
</ul>
</div>
</body>
</html>
效果图：
在分页时要注意的主要是列表的css属性，如何才能让列表在同一列，如何才能隐藏ul列表的小黑点等等
1.li中的元素水平排列,关键属性是float: left;
2.取消 .il 和 .ul 前面的黑点：list-style: none;
