源：
在用div+css做網頁的時候float是最常用的，相對於position比較好控制一點。
float分為：float：left；float：right；float：none；一般情況下只用前兩個。
浮動從字面意思就知道他是把該層浮起來，在瀏覽器預設的情況下這個位置上是空的，所以在使用float布局的時候初學者要記得當這一塊做完時清除浮動，不然會影響到下面的布局，等到用的相當熟練的時候，就不用每個都清除，只清除會影響下面布局的浮動就行了....
清除浮動，clear：both；一般使用的時候我們是在需要清除浮動的層下面加上乙個空層，如下：
< /div>
css .left
.right
.clear
再者就是浮動後標籤的一些預設屬性變化，浮動後的層的大小是有內容來定的，也就是說浮動後內容有多大他就預設為多大，我們可以設定他的寬高來控制，行屬性 的標籤在預設屬性下是不能設定寬高的，我們可以用浮動讓他改變他的預設屬性，這樣更有利於我們控制標籤...
在經過反覆的練習我們會發現，有很多瀏覽器在層與層之間有預設的間距，看似很小的間距大卻會影響整體的布局，讓人很反感，這時候我們可以選擇讓這些有預設間距的層浮動來消除間距，因為浮動後的層都是緊挨這的沒有間隙..
position定位布局，該屬性常用的值有relative（相對），absolute（絕對）；z-index；
1：設定了position:relative而不設定left,top等屬性的時候，層顯示的位置和不設定position屬性或者position值取static時一樣。
2：當乙個層設定了position:relative，而且使得層位置產生相對偏移時，並不影響文字流中接下來的其他層的位置。
當我們設定position的值為relative時，層依然存在於文字流中，也就是不管位置是否偏移，文字流中依然為它保留了該有的位置。但當層設定了position:relative並產生偏移（設定了top,left等值）時，該層將完全從文字流中脫離，進而以該層所在的父容器的座標原點為參考點進行偏移，可以這理解，該層已經和同級容器中的其它元素脫離了關係，也不會對其它元素產生人和影響。
一般我們在使用定位布局的時候，通常情況下是在父級標籤上設position:relative，在需要定位的層上設position:absolute；top：20px；left：10px；，這樣控制起來相對比較好控制...
position與float屬性的使用
1 使用float時，可以說是用於布局，取值主要有left right none。就是將該塊的元素浮動起來，在瀏覽器預設的情況下，該元素的位置是為空的，即脫離了文件流而存在，如果有其他元素，那麼這些元素會將該元素在瀏覽器中本身的位置所佔據，進而將該空白部分填充。如果元素浮動了，那麼它會對其後面的元素...
網頁布局 float與position的區別
網頁開發中布局是乙個永恆的話題。巧妙的布局會讓網頁具有良好的適應性和擴充套件性。css的布局主要涉及兩個屬性 position和float。它們倆看上去很容易被弄混，可是仔細分析一下，它們的區別還是很明顯的。下面和大家分享一下我的學習心得。首先，先介紹乙個很重要的概念 文件流 明白了這個概念之後就很...
css系列之position與float
塊級元素 塊級元素是那些視覺上會被格式化成塊狀的元素，通俗一點來說就是那些會換新行的元素。例例如 display屬性為block,list item,table,flex,grid。塊元素塊元素是 display 屬性值為 block 的元素，它應該是 塊級元素 的乙個子集。行內級元素 行內級元素是...