課程
/前端開發
/HTML/CSS
/網頁布局基礎
#header?{
? ?width:?100%;
? ?overflow:?hidden;
2016-05-26
源自:網頁布局基礎 4-6
正在回答
header里面的overflow:hidden,是起到閉合浮動的作用,因為父元素沒有設置寬高,header的寬高完全由里面的子元素撐起來的,nav在這里設置了float,這樣會導致父元素的高度塌陷,只包裹logo這一塊的情況,你把overflow:hidden去掉之后會發現下面的mainbody部分忽略了nav的位置向上移動了,給沒有寬高的父元素設置overflow:hidden之后,里面的子元素會被重新定義塊屬性被包裹起來,而clear只能達到清除浮動的作用,是用在被浮動影響到的元素上的,所以不能用clear代替哦
不可以,在父元素給定寬度+再設置overflow: hidden這樣一起才可以實現清除浮動的效果;而clear:both方法適合給本身清除浮動
舉報
讓你精通CSS中三大定位機制,徹底掌握網頁布局的相關知識
Copyright ? 2025 imooc.com All Rights Reserved | 京ICP備12003892號-11 京公網安備11010802030151號
購課補貼聯系客服咨詢優惠詳情
慕課網APP您的移動學習伙伴
掃描二維碼關注慕課網微信公眾號
2016-05-30
header里面的overflow:hidden,是起到閉合浮動的作用,因為父元素沒有設置寬高,header的寬高完全由里面的子元素撐起來的,nav在這里設置了float,這樣會導致父元素的高度塌陷,只包裹logo這一塊的情況,你把overflow:hidden去掉之后會發現下面的mainbody部分忽略了nav的位置向上移動了,給沒有寬高的父元素設置overflow:hidden之后,里面的子元素會被重新定義塊屬性被包裹起來,而clear只能達到清除浮動的作用,是用在被浮動影響到的元素上的,所以不能用clear代替哦
2016-05-26
不可以,在父元素給定寬度+再設置overflow: hidden這樣一起才可以實現清除浮動的效果;而clear:both方法適合給本身清除浮動