在最近的學習中，在github上找了一些布局練習，我發現了我自己對布局超級不熟悉（很難受）。
在以前的學習css過程中，感覺使用css就記住各個屬性的屬性值以及作用就ok了，但是實際上呢？呵呵一笑。不說了，太傷心了，進入正題吧！
最近我使用float和margin布局，加深了我對這兩個一起使用的理解。（新生可以看一下，大神請忽略）
float: left | right | none | inherit脫離標準流，處於更加高階的層面，影響父元素和後面元素的布局，這裡就不具體介紹了。
這裡主要講margin-left和margin-right
margin-left: 設定元素的左外邊距。
margin-right: 設定元素的右外邊距。
以下**：
html:
123
.box
.zi_box1
.zi_box2
.zi_box3
.clear
三個子盒子充滿父盒子，因為但他們寬度可以在父盒子裡面撐開。
如果父盒子撐不開呢？
加大乙個子盒子的寬度，序號為3的盒子
zi_box3那麼第三個盒子則會另外起一行。
在第一**的基礎上，增加乙個margin值
zi_box1反之，給盒子3設定乙個外邊距的值，盒子1和盒子2不設定外邊距，是不是盒子3也會另外起一行呢？答案是肯定的，因為他們的寬度已經超過父盒子的值了。
在不改變dom的順序的情況下，使盒子3，盒子1，盒子2的順序呢？是不是就可以充分使用margin這個屬性了。最開始白痴的我（很少練習布局吧，大神就不要噴我了，我只是個菜鳥）
白痴**
.zi_box1
.zi_box2
.zi_box3
//這裡很天真的想法，以為每個元素是單獨行動
我當時就傻了，這是什麼玩意。
但是在最後的摸索中，我知道原因了，最最最最重要的就是dom的執行順序
造成這樣的原因就是：盒子1先解析，margin-left: 200px,那麼這樣盒子3也就去了第二行; 再盒子2解析，margin-left：200px，那麼盒子2也去了第二行，因為第一行已經有600px這麼寬的長度了。最後解析盒子3，margin-left：-400px,盒子向前移動400px,不就造成了這樣的效果圖嘛。
這樣想的，就是指考慮片面的，而不是全域性的
實現三列布局的最終**
.zi_box1
.zi_box2
.zi_box3
可以簡單的這樣理解
盒子1向右移動200px，那麼盒子2和盒子3也會向右移動200px,具體的效果圖如下
那麼盒子3移動到前面去，是不是需要600px的距離啊（是不是很容易懂，嘻嘻），當然這只是我的片面理解，也不完全是對的。
在這種思維模式下，還要注意一點：當超出的部分盒子還是會遵守float的規則的。
那麼float: right和margin-right是一樣的道理。
這是我的第一篇部落格，寫的太菜，不要笑我喲。
喜歡我的話，點個關注吧！
android中padding和margin的區別
padding和margin都是指代距離。padding的使用 在乙個textview中，使用android padding是指textview的內容 android text 離這個textview邊框的距離。imageview中則是imageview的內容 android src 距離這個ima...
理解css中的float和clear
css浮動 float,clear 通俗講解 1.假如某個div元素a是浮動的，如果a元素上乙個元素也是浮動的，那麼a元素會跟隨在上乙個元素的後邊 如果一行放不下這兩個元素，那麼a元素會被擠到下一行 如果a元素上乙個元素是標準流中的元素，那麼a的相對垂直位置不會改變，也就是說a的頂部總是和上乙個元素...
CSS中float和Clear的使用
本文和大家重點討論一下css中float和clear屬性的使用，乙個float物件可以居左或居右，乙個設定為float的物件，將根據設定的方向，左移或右移到其父容器的邊界，或其前面的float物件的邊界，而緊隨其後的非float物件或內容，則包圍在其相反的方向。css中float和clear屬性用法...