Div的寬度與高度的100%設定

div的100%是從其上一級div的寬高繼承來的，所以必須設置其上一級div的寬度或高度，否則無效。

舉例說明：父div(deman)寬300高200，子div(cc)如果在這個條件下設置divcc的寬高都為100%的話，那cc的確切大小就是父div的大小(寬300高200)，在嘗試中你會發現，div顯示會受自身和其上一級div的padding和margin影響，而其實際寬高不受影響。值得玩味噢！

瀏覽器一般默認解釋為內容的高度，而不是100%。但是只要為html和body設置高度為100%就可以了：html,body{height:100%;}，這樣之后div會按比例來繼承上一級的高度了，僅僅設置的DIV元素的height屬性貌似沒有什么效果。

那么，如下的樣式可以設置Div撐滿整個頁面：

<style type="text/css">
        html
        {
         height:100%;
         margin:0;
        }
        body
        {
            height:100%;
            margin:0; 
        }
    </style>

<div style="height:100%; z-index:1">
</div>

 

有一點需要注意的是，Html級元素默認寬度是100%，即整行；但是高度並不是100%，而僅僅是一行而已。

所以要想實現撐滿整個頁面，必須顯式地設置高度為100%！