課程
/前端開發
/HTML/CSS
/網頁布局基礎
為什么設置width:100%;overflow:hidden能清除浮動呢?像半天沒想明白?。?/p>
2015-07-19
源自:網頁布局基礎 3-2
正在回答
嚴格來說,是只有在p的寬度加上兩個div的寬度大于瀏覽器的寬度時才會清除浮動影響,100%的寬度+兩個div的寬度是沒問題的,甚至小一點90%都可以,具體可以多小是要看兩個div的寬度加上去為準的。但如果你設置固定寬度為100px的話,是不可能換行的,也就是不能清除浮動的影響的,因為這明顯小于瀏覽器的寬度,設置overflow:hidden是為了溢出時隱藏的,這里看來,我的理解是文字不能超出這個范圍,因為設置了寬度,如果寬度不夠大的話會自動換行,這時候就和正常的p是一樣的,所以才需要兩個值都設置,而且你要注意固定寬度的值
<script>alert('dd')</script>
嚴格講,不是“清除浮動”,浮動根本沒有清除,應該說“清除浮動的影響”。
p設置overflow后,會把他的子元素變成block,等于說p的包裹范圍變大了,并且以內容的邊界進行包裹。
此時,p本身是受到float影響的,但內容并不受float影響,還是按照flow的方式占行。
所以等于并沒有hidden,而是讓內容顯示出來了。
總體來說,p是沒清楚浮動的,但內容并不受浮動影響,看起來就是清除浮動了
舉報
讓你精通CSS中三大定位機制,徹底掌握網頁布局的相關知識
Copyright ? 2025 imooc.com All Rights Reserved | 京ICP備12003892號-11 京公網安備11010802030151號
購課補貼聯系客服咨詢優惠詳情
慕課網APP您的移動學習伙伴
掃描二維碼關注慕課網微信公眾號
2016-08-10
嚴格來說,是只有在p的寬度加上兩個div的寬度大于瀏覽器的寬度時才會清除浮動影響,100%的寬度+兩個div的寬度是沒問題的,甚至小一點90%都可以,具體可以多小是要看兩個div的寬度加上去為準的。但如果你設置固定寬度為100px的話,是不可能換行的,也就是不能清除浮動的影響的,因為這明顯小于瀏覽器的寬度,設置overflow:hidden是為了溢出時隱藏的,這里看來,我的理解是文字不能超出這個范圍,因為設置了寬度,如果寬度不夠大的話會自動換行,這時候就和正常的p是一樣的,所以才需要兩個值都設置,而且你要注意固定寬度的值
2016-04-25
<script>alert('dd')</script>
2015-09-05
嚴格講,不是“清除浮動”,浮動根本沒有清除,應該說“清除浮動的影響”。
2015-07-25
p設置overflow后,會把他的子元素變成block,等于說p的包裹范圍變大了,并且以內容的邊界進行包裹。
此時,p本身是受到float影響的,但內容并不受float影響,還是按照flow的方式占行。
所以等于并沒有hidden,而是讓內容顯示出來了。
總體來說,p是沒清楚浮動的,但內容并不受浮動影響,看起來就是清除浮動了