2012-04-29 97 views
0

下面才是真正的HTML大大简化版本:孩子CSS样式覆盖父样式时,它不应该

<html> 
<head> 
<style type="text/css"> 
     h3 { background: blue; } 
     p {background:grey; } 
    </style> 
</head> 
<body> 
    <h3>The paragraph below will style correctly.</h3> 
    <p> 
     As you can see, I am stylish.</p> 
    <p> 
     <h3>But this paragraph goes wrong.</h3> 
     I am sad. I have no style. 
    </p> 
</body> 
</html> 

巴掌,在一个浏览器(已尝试的Firefox 12和IE9),并同时第一款有灰色背景,第二个没有。请注意,它甚至没有蓝色背景,造型已丢失。据我了解,h3的背景应该是只有影响h3,不会向上游进入父母并影响到那个。

我错过了什么吗?注意以上是简化的。我想要段落中的标题,但这似乎是不可能的,没有样式错误。以上是否有错误?谢谢。

回答

3

这是不合法的标记在一个段落中有标题,这就是为什么样式被搞砸了。

您可以在此处验证您的标记:http://validator.w3.org/

+0

谢谢。我应该补充说它是HTML5的更多细节。验证程序返回以下错误:范围中没有p元素,但看到一个p结束标记。所以看起来像hX标签的存在将会关闭P标签的范围。我认为它在语义上是有道理的。谢谢。 – 2012-04-29 08:15:33