Div標籤嵌套

所以我有以下的HTML：Div標籤嵌套

<html> 
<head> 
    <style> 
     .box 
     { 
      height: 100px; 
      width: 100px; 
     }  
     #box1 
     { 
      background-color: Red; 
     } 
     #box2 
     { 
      background-color: Red; 
     } 
     #box3 
     { 
      border-style: dotted; 
     } 
     #box4 
     { 
      background-color: Red; 
     } 
    </style> 
</head> 
<body> 
<div id="boxes"> 
    <div id="box1" class="box"></div> 
    <div id="box2" class="box"></div> 
    <div id="box3" class="box"></div> 
    <div id="box4" class="box"></div> 
</div> 
</body> 
</html>

如果我改變任何div標籤對他們的單個標籤的版本，例如：

<div id="box1" class="box"/>

後續至少在Chrome，Firefox和IE中嵌入標籤。有沒有人知道這個行爲的交易？這對我來說似乎是一個錯誤。

來源

2011-11-16 Mike Cheel

奇怪，這裏沒有任何表明行爲。你是什麼意思嵌套？就像當你檢查頁面的源代碼時你看到它們嵌套了？或視覺？ – Jerome

習慣上我只使用BR和IMG的單一標籤版本，其餘的我總是打開和關閉。不知道爲什麼我這樣做，但我記得它可能與舊的瀏覽器兼容性有關。我認爲所有現代瀏覽器都可以。 – ToddBFisher

<div>不是一個HTML文檔中的一個有效的自閉標籤。如果您將它作爲XHTML提供，那麼它應該可以工作（如果不是，那麼這是一個瀏覽器錯誤）。

你也應該記住，文檔類型不改變文檔的解釋，只MIME類型（所以如果你用服務內容application/xhtml+xml型的文件，將工作） - 你可以在這裏閱讀更多：http://www.webdevout.net/articles/beware-of-xhtml#content_type

來源

2011-11-16 15:25:28 deviousdodo

問題可能是由於瀏覽器進入了怪癖模式。

你可以嘗試添加一個DOCTYPE

來源

2011-11-16 15:23:28 Molochdaa

回答

相關問題