UL完美居中的方法

讓UL完美居中

ul及li標籤咱們在寫前端html頁面的時候老是會用到，有時候咱們須要一個橫向菜單，不能定義寬度，裏邊的li還要自適應其中的文字內容（這是很苛刻的條件了），由於這時候的li有float:left屬性，很差實現哦，這篇文章就是告訴你們如何作一個能自適應內容，不須要知道ul寬度，還能居中顯示的菜單或者其它東西。

首先咱們主要用的的是ul及li標籤

<ul>
        <li>
                .......
        </li>
</ul>

和平時寫的沒什麼差異，仔細看樣式

ul{ position:relative; left:50%; float:left;}

     //左浮動，定位對齊到容器中間，這時候的菜單是偏右的；

ul li{ position:relative:right:50%; float:left;}

     //左浮動，讓li浮動到一行，讓li右側相對ul偏移50%；

ul li{ padding:4px 12px;}

   //給li弄些間距；


完成了經過兩個50%的偏移完成了ul列表相對父容器偏移的效果；