HTML是流式文件，所以HTML預設佈局就是流式佈局，這裡所說的流式佈局怎麼理解呢？所謂了流式                   佈局就是：所有元素（包括塊級元素和非塊級元素）將以流的形式依次從左到右、從上到下排列！

       流式佈局是重點，在知道流式佈局的原理之後，還要專注某一個元素在流式佈局中自我的表現，元素空間分為佔用空間

       說到單個元素佔用空間，不免有必須知道元素邊距的事！因為邊距margin會對文件流種其他的元素產生影響！

       元素的佈局分為相對佈局和絕對佈局，如果指定某元素的佈局為相對佈局，那麼該元素在流式佈局中的位置還是佔用的！也就是不會影響其他元素的位置（就好像是預設的流式佈局一樣，自動被安排放置，各個元素的位置是相對的，所以認為是相對佈局，這樣理解我感覺更恰當）；如果指定某元的區域性為絕對佈局

       所以影響文件的流式佈局的因素有某元素自身使用了絕對佈局，導致脫離文件流，這就是我們關注的重點！因為它改變了遊戲規則，那麼這個絕對佈局特殊性在哪裡？那就是他的位置脫離之後是如何佈局到UI中的，如果position被指定（相對佈局和絕對佈局都可以），那麼left、top、right、bottom屬性就生效了，其他情況屬於無效！而且四個元素只能用相鄰的兩個元素，即不能使用上又使用下，使用了左又使用右！ 還有就是使用了絕對定位的元素因為已經脫離了文件流，margin-bottom和margin-right兩個值不再對文件中的元素產生影響（margin-top和margin-left還是有影響,當然不影響流式佈局中的元素，但是影響其他絕對佈局的元素，但是margin-right和margin-bottom就對其他元素沒任何影響了），絕對定位和相對定位的累加加效果不同，如果top、bottom、left、right屬性和margin屬性偏移的方向相反，top、bottom、left、right屬性值有效，反方向的margin屬性值無效！

       總結：

       相對定位的元素不會脫離文件流，佔用文件流的空間，Left; Right; Top和Bottom屬性與margin屬性混合使用會產生累加效果。 絕對定位的元素脫離文件流，偏移不影響文件流中的其它元素，Left; Right; Top和Bottom屬性與margin屬性混合使用，偏移方向相同值累加，方向相反，margin屬性值無效。 絕對定位的元素以最近的定位祖先元素為參照物。