3つのdiv

Question

で画面を分割する方法

次の要求による三件のdivで画面を分割する方法： - 画面全体（100％×100％） カバーすべき主DIV - DIVメインDIVをカバーすべき後のサブDIVを（各サブDIV = 33％）

は、私は次のようにそれを実行しようとしました：

<div style="width:100%; height :100%; background-color:Lime;"> 
    sss 
     <div style="width:100%; height:34%; background-color:Blue;"> 
     a 
     </div> 
     <div style="width:100%; height:33%; background-color:Gray;"> 
     b 
     </div> 
     <div style="width:100%; height:33%; background-color:Aqua;"> 
     c 
     </div>   
    </div> 

Answer 1

あなたが100％にbodyとhtmlの高さを設定する必要があります。これはfiddleを参照してください。

Answer 2

私は混乱の主な原因は、あなたの主なdivは、スタイル要件を満たすために必要なだけ多くのスペースを取ることになると思います。親要素のサイズの100％を占めますが、そのサイズが定義されていない場合は、そのサイズに含まれるものの最小サイズにしか成長しません。

このfiddleでは、200pxの高さに定義されたdivにコードをラップしただけです。メインdiv、含まれるdivの前）

Answer 3

ホワイトマージンを削除する場合は、bodyタグのスタイルを "margin：0"に設定します。