javascript - 關于使用overflow: hidden來清除浮動的疑問
問題描述
正常情況下，給浮動的父元素設置overflow:hidden;就可以清楚浮動，但是我發現被浮動元素的父元素是body時，給body設置overflow：hidden，是無法清除浮動的，有人說是body不屬于普通流，所以無效，有誰能解釋下嗎？
感謝：CRIMX借用王大陸的一句話：
你這種人不是大神，就是走在成為大神的路上。
問題解答
回答1：這是因為并沒有產生新的 BFC
產生新 BFC 的一個條件：
Block-level, non-replaced elements in normal flow when ’overflow’ does not compute to ’visible’ (except if the ’overflow’ property’s value has been propagated to the viewport).
為什么對 <body> 設置 overflow 會擴散到 viewport：
UAs must apply the ’overflow’ property set on the root element to the viewport. When the root element is an HTML 'HTML' element or an XHTML 'html' element, and that element has an HTML 'BODY' element or an XHTML 'body' element as a child, user agents must instead apply the ’overflow’ property from the first such child element to the viewport, if the value on the root element is ’visible’. The ’visible’ value when used for the viewport must be interpreted as ’auto’. The element from which the value is propagated must have a used value for ’overflow’ of ’visible’.
相關文章：
1. node.js - express請求的具體方法2. node.js - AWS配置nginx的反向代理不生效問題3. node.js - 關于Node爬蟲爬小說的問題4. html5 - 有可以一次性把所有 css外部樣式轉為html標簽內style=" "的方法嗎?5. web - Rails3使用form_for時出現undefined method `*_path’錯誤。6. node.js - 關于mongoose方法的回調函數的參數問題，如何知道參數個數以及參數代表什么含義呢？7. node.js - react應用加了react-redux后webpack打包后頁面顯示空白，也沒有報錯8. node.js - 引入node-fetch后,使用webpack的時候報錯!9. 在啟動后的90秒內，Heroku- Web進程未能綁定到$ PORT。TooTallNate Websockets10. node.js - 如何使用mongoose連接數據庫中已經存在的一個集合。
網公網安備