Question

我是html的新手。当我在＆＃34; style＆＃34;之间放置任何标签时，为什么代码不起作用？和＆＃34; p＆＃34;标签

＆＃13;

p:first-child {
  color: red;
}

＆＃13;

<h1>example</h1>
<!-- problem is here -->

<p>Hello venus</p>
<p>hello world</p>

＆＃13;

Answer 1

您需要使用first-of-type。

＆＃13;

p:first-of-type{
color:red;
}

＆＃13;

<h1>example</h1> <!-- problem is here -->

<p>Hello venus</p>
<p>hello world</p>

＆＃13;

First-child只是第一个孩子，而不是第一个孩子。

＆＃13;

:first-child {color:red;}

div h1:first-child {color: green;}
div p:first-child {color: blue} /* match nothing */

＆＃13;

<h1>example</h1> <!-- problem is here -->

<p>Hello venus</p>
<p>hello world</p>

<div>
  <h1>example</h1> <!-- problem is here -->
  <p>Hello venus</p>
  <p>hello world</p>
</div>

＆＃13;

Answer 2

p:first-child定位于身体的第一个孩子。您可能需要p:first-of-type

＆＃13;

p:first-of-type {
  color: red;
}

＆＃13;

<h1>example</h1>
<!-- problem is here -->

<p>Hello venus</p>
<p>hello world</p>

＆＃13;

Answer 3

最好使用:first-of-type选择器

＆＃13;

p:first-of-type{
    color:red;
 }

＆＃13;

<h1>example</h1> <!-- problem is here -->

<p>Hello venus</p>
<p>hello world</p>

＆＃13;

伪类不起作用

3 个答案: