如果一個ul下面有多個li,而且這些li要橫向排列,不知道每個li的寬度,同時也不知道ul的寬度,如果讓這個ul水平居中呢?
目前知道了兩個方法:
1、ul{text-align:centrer;}
li{display:inline;}
這種方法是把li轉換成行內元素,然后父級元素居中顯示;
2、用一個div把ul包起來,<div id="wrap"></div>
#wrap{float:left;position:relative;left:50%;}
ul{position:relative;left:-50%;}
這種方法首先把父級元素浮動起來,讓子元素的內容撐開寬度,這樣父元素和子元素的寬度就是一致的;
然后讓父元素的最左邊與body(假設body就是最外邊的元素)的中線對齊,同時相當于ul的左邊也與body的中線對齊了;
然后再把ul的左側向左移動50%(wrap的寬度與ul的一致),即可居中!