浮動元素的包含塊為其最近的塊級祖先元素。
定位：根元素的包含塊（也稱為初始包含塊）由使用者**建立，在html中，根元素就是html元素，不過有些瀏覽器會使用body作為根元素。在大多數瀏覽器中，初始包含塊是乙個視窗大小的矩形，不等於視窗。
對於乙個非根元素，如果其position值是relative或static，包含塊則由最近的塊級框構成。
對於乙個非根元素，如果其position值是absolute，包含塊設定為最近的position值不是static的祖先元素（可以是任何型別）。這個過程如下：
如果這個祖先是塊級元素，包含塊則設定為該元素的內邊距邊界，也就是內容區域。
如果沒有祖先，元素的包含塊定義為初始包含塊。
應用：(1)使用絕對定位來模擬固定定位
ie6下，fixed失效
解決思路：
系統的滾動條是在文件上，而不是在html,body上。
body下的元素當position為absolute時，包含塊為初始包含塊，當拉動系統滾動條時，包含塊隨之移動。
把系統滾動條禁止掉，給body加上滾動條，body成為元素的初始包含塊。拉動滾動條，達到fixed的效果。
效果圖：
拖動滾動條，元素位置沒變：
初始包含塊
網頁的視窗的結構 最外層 瀏覽器視窗 視口 初始包含塊 html根元素 body 1 doctype html 2 html 3 head 4 meta charset utf 8 5 title title 6 style 78 9網頁的視窗的結構 10最外層 瀏覽器視窗 視口 11初始包含塊 1...
定位之包含塊
在前端開發中，經常會碰到使用定位的情況，常見的一種情況是將定位的元素的父級也開啟定位，通過參照父級元素來對元素進行定位，然而在實際開發中，情況遠遠不止一種，總的來說，定位元素參照的都是其包含塊，但是情況不同，包含塊也不一樣。首先，解釋一下包含塊，一般來說，根元素 的包含塊 也稱為初始包含塊 由使用者...
包含塊的確定與作用
乙個元素的尺寸和位置經常受其包含塊 containing block 的影響。大多數情況下，包含塊就是這個元素最近的祖先塊元素的內容區，但也不是總是這樣。當乙個客戶端 比如說瀏覽器 展示乙個文件的時候，對於每乙個元素，它都產生了乙個盒子。每乙個盒子都被劃分為四個區域 內容區內邊距區 邊框區外邊距區 ...