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