html - 为什么以下HTML代码中的最后一段没有显示颜色？

This question already has an answer here:

Is it valid to have paragraph elements inside of a heading tag in HTML5 (P inside H1)?

                                    （1个答案）


                                2年前关闭。


我正在学习HTML和CSS，却很困惑nth-of-type的工作方式？在谷歌搜索时，我知道它选择了指定类型的第n个元素。在下面的代码中，我想为所有第一段设置样式，但只有上面两个段落被设置样式。

<!DOCTYPE html>
<html>
<head>
    <title>selector</title>
    <style type="text/css">
        p:nth-of-type(1){
            color: blue;
        }
    </style>

</head>
<body>
<h1>this is heading 1</h1>
<p>this is a paragraph 1</p>  //--> this is working

<div>
    <h2>this is heading 2</h2>
    <h2>this is the heading 3</h2>
    <p>this is paragraph 2</p>     //-->this is also working
</div>

<h3>this is heading 4
    <h4>this is heading 5</h4>
    <p>This is paragraph 3</p>     //-->Not working
</h3>


</body>
</html>

最佳答案

我不认为您应该将元素放在这样的标头标签中，这是与其他标签不同的一种标签。