行内元素
text-align:center
<body> <div class="txtCenter">内容居中</div> <style> .txtCenter{ text-align:center; } </style> </body>
定宽块状元素
margin:20px auto;
<div class="fixedCenter">内容居中</div> .fixedCenter{ 100px; border: 1px solid #000; margin: 10px auto; }
不定宽块状元素
.container{ float: left; position: relative; left: 50% } .container ul{ list-style: none; margin: 0; padding: 0; position: relative; left: -50% } .container li{ float: left; display: inline; margin-right: 8px; } <div class="container"> <ul> <li><a href="#">1</a></li> <li><a href="#">2</a></li> <li><a href="#">3</a></li> </ul> </div>