//需求：ul不能定具体宽度，只能根据li的个数来计算宽度。
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>特殊性</title>
<style type="text/css">
*{padding:0; margin:0;}
ul,li{ list-style:none;}
.wrap{ float:left; position:relative; left:50%;}
.wrap ul{ background:#f00; height:30px; line-height:30px; left:-50%; position:relative;}
.wrap ul li{ float:left;}
.wrap ul li a{ color:#fff; display:block; padding:0 10px;}
</style>
</head>
<body>
<div class="wrap">
<ul>
<li><a href="#">首页</a></li>
<li><a href="#">网站地图</a></li>
<li><a href="#">网站地图</a></li>
<li><a href="#">网站地图</a></li>
<li><a href="#">网站地图</a></li>
<li><a href="#">网站地图</a></li>
<li><a href="#">首页</a></li>
<li><a href="#">首页</a></li>
</ul>
</div>
</body>
</html>
//可以实现不定宽度居中，可是元素左右两侧空白宽度之和（绿色箭头部分的）要大于ul本身不定宽度元素的宽度。不然就会出现滚动条。
//so不建议使用，用js解决吧，纠结的同学们
