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

Question

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

有点像

(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() 当前 can only have a single "simple selector" .如果它支持更多，那么即使没有 :has 也是可以实现的。

向 future 的读者问好，我希望它成功了。现在，我将此保留为开放状态，也许有人会用 CSS 3.1 弄明白。