CSS：引用没有类或ID的嵌套元素

Question

我是CSS / HTML新手并且有一个关于嵌套的问题（我认为很多其他人可能会遇到这个问题，因为他们不熟悉CSS）。我有以下代码：

<article id="rightarticle">
     <h2 id="sightings">Cougar Sightings Increase <img src="cougar.jpg" alt="BEWARE"/></h2>  

h2 元素不是文章子部分下唯一的 h2 元素;然而，这是第一次。我的目标是仅定位 第一个 h2 元素以更改其背景。

不使用#sightings引用 - 即id - 如何仅引用CSS中article元素的第一个h2元素？接受语义约定，那篇文章是最大的元素，我假设我不能使用第一个子引用来隔离仅上面的元素？

Answer 1

使用>子选择器和:first-of-type伪类选择器。

按#rightarticle ID：

选择

#rightarticle > h2:first-of-type {}

按<article>标记选择：

article > h2:first-of-type {}