段忽略，因爲另一款嵌套

也許我的CSS知識是有限的，但我不uderstand這種風格：段忽略，因爲另一款嵌套

<p style="color: green"> 
    <p style="color: red">This is red</p> 
    This should be green. But it's not. 
</p>

第二行將以黑色忽略渲染「顏色：綠色」。爲什麼？我在Chrome 28和Firefox 22中測試過它。

來源

2013-08-03 Robert Veres

還應該注意，如果您在瀏覽器中檢查過結果，則可能會發現問題的根源。檢測工具現在可用於所有主流瀏覽器。 – Cthulhu

您不能嵌套段落。

段落是一個自動關閉元素，</p>是可選的 - 任何塊元素都會自動關閉最後打開的<p>。

這是發生了什麼：

<p style="color: green"> 
</p> <!-- auto-closed paragraph --> 

<p style="color: red"> 
    This is red 
</p> 

This should be green. But it's not. 

</p> <!-- here you have syntax error -->

來源

2013-08-03 11:31:25 MightyPork

謝謝！我試圖在同一段落中嵌入一個div。它看起來像段落gests不僅關閉了段落，而且關閉了任何塊元素。還嘗試在h1中嵌套h1，結果與段落相同。 –

是的，我也試過了，它看起來像這樣 - 任何**塊元素**關閉一段。讓我糾正答案。 – MightyPork

不能嵌套<p>的。如果一個段落的尾部標記跟在另一段落後面，則可以省略。這意味着在您的代碼中，第一段不包含文本，第二段包含「This is red」。然後有一些文字「這應該是綠色的，但不是。」其中沒有樣式和關閉</p>標籤，它沒有開始標籤。

檢查：http://www.w3.org/TR/html-markup/p.html

來源

2013-08-03 11:31:42 MrP

段落不能被嵌套在另一個段落或塊元件內。

當你的代碼在瀏覽器中呈現它呈現爲像下面

<p style="color: green"></p> 
    <p style="color: red"> 
     This is red 
    </p> 
    This should be green. But it's not. 
    <p></p>

所以你可以看到，沒有任何包裝到最後一句，結果被應用默認的CSS顏色即黑色在那。

來源

2013-08-03 11:52:47

段忽略，因爲另一款嵌套

回答

相關問題