css浮動筆記

浮動的特點：

(1)浮動只有左浮動和右浮動

(2)浮動的元素會向右或者向左移動直到碰到父元素邊際或者上乙個浮動元素的邊際為止

(3)浮動的元素會脫離文件流，不在佔據物理空間，後面不浮動的元素會佔據浮動元素的位置，不浮動元素的文字將避開浮動的元素形成文字環繞

(4)相鄰的浮動的元素可以並成一行，超過父級元素的寬度會自動換行

(5)父類元素如果子元素全部浮動將無法撐開寬度，需要用到清除浮動

解決父類元素寬度無法撐開：

(1)給父類元素設定相應的寬高

(2)給父元素設定屬性overflow:hidden

(3)使用乙個與父元素並列的空的div並為其設定樣式：clear：both，清除浮動的影響

(4)使用偽元素:

父元素選擇器:after

浮動原理及清浮動筆記

一句話解釋 元素浮動後，會脫離文件流，接著會按照指定的方向移動，一直到碰到父級的邊界或另外乙個元素為止。浮動的 folat left right none，none 表示為不浮動，完全沒有浮動的效果。使塊元素在一行顯示 使內嵌支援寬高 不設定寬度時，寬度由內容撐開 脫離文件流 文件流是文件中可顯示物...

CSS學習筆記 浮動

float left float right float none css的float 屬性可以使乙個元素脫離正常的文件流，然後被安放到它所在容器的的左端或者右端，並且其他的文字和行內元素圍繞它安放。除了left和right，float還有乙個屬性 none，用來防止元素浮動。有一些列特定規則控制著...

css浮動清除筆記

1.在文件流中內容的高度可以撐起父元素的高度 2.在浮動流中浮動的元素是不可以撐起文件流父元素的高度 如果父元素也是浮動的就可以 可以看到將p元素設定浮動之後，並沒有撐起父元素div 我是文字1 我是文字1 我是文字1 我是文字2 我是文字2 我是文字2 根據浮動排列的規則和浮動不能撐起父元素的高度...