CSS中,float浮動的理解

2021-07-30 11:02:35 字數 568 閱讀 5097

浮動什麼意思呢,比如,預設的,我們知道,div是佔滿一行的,現在我們想把兩個div顯示在一行上,那怎麼辦呢

11111

2222

這樣我們就設定了兩個div,乙個寬度100px,乙個寬150px,可預覽一下,我們的div仍在兩行上,那麼怎麼把它改到一行上呢,這兒就需要float,設定第乙個div的float為left

11111

2222

再預覽,就可以看到,它們到一行上了。

clear是什麼意思呢,clear是清除的意思,它有三個值,left,right,both

很好理解,如果設定了clear:left,它就不怕它的左邊有float,同理clear:right,clear:both,是左右都不讓有float

舉個例子,還是上面的

我們設定第二個div的clear:left,也就是不讓它左邊有float

11111

2222

我們預覽一下,就可以看到,儘管第乙個div已經float:left了,這兩個div仍然在兩行上,就是由於第二個div不讓它左邊有float

因為css的定義是後面的可以覆蓋前面的,明白了吧

CSS中的浮動(float)

宣告 本人的所有部落格皆為個人筆記,作為個人知識索引使用,因此在敘述上存在邏輯不通順 跨度大等問題,希望理解。分享出來僅供大家學習翻閱,若有錯誤希望指出,感謝!網頁布局的核心 就是用 css 來擺放盒子 css 提供了來設定盒子的擺放位置,分別是 標準流 和,其中 普通流 標準流 行內元素會按照順序...

理解CSS浮動float 定位position

一 浮動float i 定義及規則 float預設為none,對應標準流的情況。當float left 時,元素就會向其父元素的左側靠緊,脫離標準流,同時寬度不再伸展至充滿父容器,而是根據自身內容來確定。ii 演示規則 準備 xml html code複製內容到剪貼簿 wxdwhjv 1 中間給 f...

css中的浮動元素float

浮動屬性作為css的重要屬性,被頻繁地應用在網頁製作中。所謂元素的浮動時指設定了浮動屬性的元素會脫離標準文件流的控制,移動到其父元素中相應位置的過程,float屬性的基本語法格式是 選擇器left 元素向左浮動 right 元素向右浮動 nons 元素不浮動,預設值 使用clear屬性清除浮動 使用...