Divins邊距

Question

我正在關注如何以及何時使用div的教程。本教程可以在這裏找到：

http://www.webreference.com/authoring/style/sheets/layout/advanced/index.html

我提出四名div的分別的班，0級，1級，級別2，和3級。像這樣：

<div id="level0"></div> 
<div id="level1"></div> 
<div id="level2"></div> 
<div id="level3"></div> 

所以我正在使用div＃1。實現的第一個CSS代碼基本上是在左側和右側設置邊距。我認爲我以前的一些CSS可能有衝突，但我不確定它在哪裏。

該團體的CSS代碼：

body 
{ 
background-color:#FBF8EF; 
margin:9px 9px 0 9px; 
padding 0; 
} 

接下來的DIV＃1的CSS代碼（或相當的div＃0）是：

#level0 
{ 
background-color:#FC0; 
} 

我不知道如果我不正確地遵循教程，或者如果我只是寫錯了，但如果任何人都可以提供幫助，這將有所幫助。讓我知道我是否錯過了任何東西。

感謝您抽出時間幫助。

Answer 1

這裏是你提到的教程全面實施。你忘記了divs的嵌套，也忘了其他divs的CSS。

這裏是鏈接：http://jsfiddle.net/WRnUv/

body 
{ 
background-color:#FBF8EF; 
margin:9px 9px 0 9px; 
padding 0; 
} 
#level0 
{ 
background-color:#FC0; 
} 
#level1 { 
    margin-left:143px; 
    padding-left:9px; 
    background:#FFF; 
} 
#level2 { 
    background:#FFF3AC; 
} 
#level3 { 
    margin-right:143px; 
    padding-right:9px; 
    background:#FFF; 
} 

<div id="level0"> 
    <div id="level1"> Level 1 
    <div id="level2"> Level 2 
     <div id="level3"> Level 3 
     </div> 
    </div> 
    </div> 
</div> 

Answer 2

你似乎沒有按照教程和巢您的div：

<div id="level0"> 
    <div id="level1"> Level 1 
    <div id="level2"> Level 2 
     <div id="level3"> Level 3 
     </div> 
    </div> 
    </div> 
</div> 

Answer 3

沒有內容，沒有寬度或高度設置一個div將不佔用空間在屏幕上，併爲此將不顯示顏色。給它一些內容或尺寸。

例如： http://jsfiddle.net/HaJc4/

<div id="level0">content</div> 
<div id="level1"></div> 
<div id="level2"></div> 
<div id="level3"></div>