前言

剛接觸float來設定ul li選單與使用margin或padding來增加選單按鈕區塊時，常東拼西湊的寫，冏
終於今日與它們熟悉感增加許多，寫篇文章統整一下XD

選單靠左

使用float:left;

1. 搭配範例 與瀏覽器的"開發人員工具"看下方解說
2. 用ul與li做出選單
3. 讓3個 li靠左對齊呈併排→ float:left;
4. 把li中的a連結變區塊元素display:block;，增加按鈕範圍至li大小
5. 可再於於li a中使用margin或padding 把按鈕範圍調整到更適當的大小
6. 最後於li(使用float)的父元素加入清除浮動clearfix即可。

選單靠右

選單靠右通常左邊會搭配logo

1. 搭配範例 與瀏覽器的"開發人員工具"看下方解說
2. 用ul與li做出選單
3. ul先靠右→float:right;
4. 再把ul內的 li靠左對齊呈併排 → float:left;
5. 把li中的a連結變區塊元素display:block;，增加按鈕範圍至li大小
6. 可再於於li a中使用margin或padding 把按鈕範圍調整到更適當的大小
7. 最後於與選單靠左不同的是，此範例中ul與li皆用到浮動，所以兩個元素都需清除浮動做clearfix。

※備註: 如果有浮動未做清除的動作，會重疊。下下篇來說清除浮動的方法們XD