課程
/前端開發
/HTML/CSS
/固定層效果
在標準文檔流中,當兩個垂直邊界margin-top或者margin-bottom相遇時,會形成一個邊界,這個邊界的高度等于兩者之中的較大者.
2016-03-24
源自：固定層效果 2-1
正在回答
你把后面那個視頻也看一下，就明白了。
這么給你說吧，在body中，我們要調整的部分為mainbody塊，此時top塊的top層與mainbody塊的top層撞車了，撞車后mainbody因為設置top=20px,取外邊框邊界高度最大的，所以，瀏覽器窗口與內容部分空出了20px，要解決此撞車問題，給top塊的top層也加一個偏移量為0px，各使用各的，就不會撞車了。
dinshuhon 提問者
不理解，能改對就行，哈哈
我了解到的是 當top設置成固定層, 在未設置偏移量時, 如果有已定位的祖先元素,將以祖先元素為基準.若無已定位的祖先元素,則以窗口為基準. 老師的代碼是: ?mainbody 和 top 的父元素是body,而body沒有設置定位.所以以窗口為基準. ?根據你的解釋 < --?視頻里說的，當top層設置為固定層時，在未設置偏移量時，mainbody上填充（設置了上外填充為20px）與top層的外填充（未設置偏移量，會默認以窗口為最外邊界）重疊會取邊界高度最大的，所以取了mainbody上外填充為20px的移動（下來了）--?>. ?我得出的結果是: top為固定定位, 沒有設置偏移且父元素沒有設置定位. ?此時的Top會與它所在文檔流中的元素產生重疊. ?且 Top會取所有重疊元素中的最大的外邊距來偏移. ? 但是,我依舊不理解為什么會重疊??? ??
視頻里說的，當top層設置為固定層時，在未設置偏移量時，mainbody上填充（設置了上外填充為20px）與top層的外填充（未設置偏移量，會默認以窗口為最外邊界）重疊會取邊界高度最大的，所以取了mainbody上外填充為20px的移動（下來了），為解決此情況，給top最外層設置一個偏移量就可以了，即top層的top為0（與默認以窗口為最外邊界）
舉報
運用屬性值就輕松實現網頁固定層效果
Copyright ? 2025 imooc.com All Rights Reserved | 京ICP備12003892號-11 京公網安備11010802030151號
購課補貼聯系客服咨詢優惠詳情
慕課網APP您的移動學習伙伴
掃描二維碼關注慕課網微信公眾號
2016-03-27
你把后面那個視頻也看一下，就明白了。
這么給你說吧，在body中，我們要調整的部分為mainbody塊，此時top塊的top層與mainbody塊的top層撞車了，撞車后mainbody因為設置top=20px,取外邊框邊界高度最大的，所以，瀏覽器窗口與內容部分空出了20px，要解決此撞車問題，給top塊的top層也加一個偏移量為0px，各使用各的，就不會撞車了。
2016-06-04
不理解，能改對就行，哈哈
2016-03-25
我了解到的是 當top設置成固定層, 在未設置偏移量時, 如果有已定位的祖先元素,將以祖先元素為基準.若無已定位的祖先元素,則以窗口為基準. 老師的代碼是: ?mainbody 和 top 的父元素是body,而body沒有設置定位.所以以窗口為基準. ?根據你的解釋 < --?視頻里說的，當top層設置為固定層時，在未設置偏移量時，mainbody上填充（設置了上外填充為20px）與top層的外填充（未設置偏移量，會默認以窗口為最外邊界）重疊會取邊界高度最大的，所以取了mainbody上外填充為20px的移動（下來了）--?>. ?我得出的結果是: top為固定定位, 沒有設置偏移且父元素沒有設置定位. ?此時的Top會與它所在文檔流中的元素產生重疊. ?且 Top會取所有重疊元素中的最大的外邊距來偏移. ? 但是,我依舊不理解為什么會重疊??? ??
2016-03-24
視頻里說的，當top層設置為固定層時，在未設置偏移量時，mainbody上填充（設置了上外填充為20px）與top層的外填充（未設置偏移量，會默認以窗口為最外邊界）重疊會取邊界高度最大的，所以取了mainbody上外填充為20px的移動（下來了），為解決此情況，給top最外層設置一個偏移量就可以了，即top層的top為0（與默認以窗口為最外邊界）