最高级别的第一个标题的CSS选择器？

Question

如何选择h*DOM中存在的第一个最高元素？

就像是

(h1, h2, h3, h4, h5, h6):first-of-ordered-set

也就是说,如果一个DOM树有,在这个顺序h2,h3,h1,h2,h1,它会选择第一个h1;
如果DOM有h3,h3,h2,h2,h4,它会选择第一个h2.
我们假设h*元素不是嵌套的.

我怀疑CSS没有这种能力,对吧？

可能有用的思考:https://css-tricks.com/extremely-handy-nth-child-recipes-sass-mixins/

编辑:为什么我需要它:CMS系统将此"第一个顶部标题"作为文档的标题(帖子,页面,...).但它将它留在页面中.然后它显示标题两次 - 一次作为帖子标题,一次在体内.JavaScript已删除.最高h*级别可能不同.

Answer 1

我发现了一些东西。CSS 做不到。然而。

W3C 正在起草新功能：

.post-content:has(h1, h2, h3, h4, h5, h6)

与 一起:not()，这将满足我的需要：

.post-content:has(h1) h1:first-of-kind,
.post-content:not(:has(h1)) h2:first-of-kind,
.post-content:not(:has(h1,h2)) h3:first-of-kind,
...

有一个问题 -:not()当前只能有一个“简单选择器”。如果它支持更多，那么即使没有 也可以实现:has。

向未来的读者问好，希望一切顺利。目前，我对此保持开放态度，也许有人会用 CSS 3.1 来解决这个问题。