[CSS]让ul中的li在所属div内成⼀⾏居中显⽰。先上效果图：
再上代码：
<!DOCTYPE html>
<html lang="utf-8">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<head>
<title>ul中li居中⽰例</title>
<style type="text/css">
.pagationDiv{
border:1px solid red; /*加此边框以便于看清ul的位置*/
}
.
pagationDiv ul{
list-style:none;
margin: 0 auto;      /*让ul在div中⽔平居中 */
padding:0;
text-align:center;  /*让li在ul中⽔平居中*/
}
.pagationDiv ul li{
display:inline-block;
height:30px;
line-height:30px;
margin-right:10px;
}
.pagationDiv ul li a{
border:1px solid teal;
padding-left:5px;
padding-right:5px;
text-decoration: none;
}
.pagationDiv ul border{
border:0px solid blue;
}
.pagationDiv ul li a:hover{
background:navy;
color:white;
div border属性}
</style>
</head>
<body>
<div id="list5pagationDiv" class="pagationDiv">
<ul>
<li><a id="prevPageLink" href="#">上⼀页</a></li>
<li><a id="fisrtPageLink" href="#">first</a></li>
<li><a id="prevDotsLink" href="javascript:void();" class="noborder">...</a></li>
<li><a id="page1Link" href="#">1</a></li>
<li><a id="page2Link" href="#">2</a></li>
<li><a id="page3Link" href="#">3</a></li>
<li><a id="page4Link" href="#">4</a></li>
<li><a id="page5Link" href="#">5</a></li>
<li><a id="page6Link" href="#">6</a></li>
<li><a id="page7Link" href="#">7</a></li>
<li><a id="page8Link" href="#">8</a></li>
<li><a id="page9Link" href="#">9</a></li>
<li><a id="nextDotsLink" href="javascript:void();" class="noborder">...</a></li>
<li><a id="lastPageLink" href="#">last</a></li>
<li><a id="nextPageLink" href="#">下⼀页</a></li>
</ul>
</div>
</body>
</html>
<script type="text/javascript">
<!--
// 脚本
//-->
</script>
END
PS：话说Editplus3真是⼀款好编辑器，现在流⾏的都没有直接查看HTML功能了。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。