Question

background-color: yellow;

<!DOCTYPE html>


<div>
  <p>Paragraph 1 in the div.</p>
  <p>Paragraph 2 in the div.</p>
  <p>Paragraph 3. Not in a div.</p>
  <p>Paragraph 4. Not in a div.</p>
</div>

我只想为div中的第一个<p></p>元素应用背景颜色。

尝试了一些CSS选择器，无法获得预期的结果。谁能帮我？

Answer 1

你在这里。

div>p:first-child {
  background-color: yellow;
}

<div>
  <p>Paragraph 1 in the div.</p>
  <p>Paragraph 2 in the div.</p>
  <p>Paragraph 3. Not in a div.</p>
  <p>Paragraph 4. Not in a div.</p>
</div>

jsFiddle

将CSS应用于直接子元素

1 个答案: