首页 > 解决方案 > 如何使用 CSS ::主题选择器

问题描述

我开始制作 HTML/CSS/Vanilla JS Web 组件库,到目前为止一切都很好。我使用的是典型的 ::part 和所有这些,但我也偶然发现了 accros ::theme 选择器,它应该可以快速访问样式,而无需创建者进行不必要的设置。

问题是,我 - 无论我尝试过什么 - 似乎都无法让 ::theme 选择器工作,有没有人可以帮助我?

screendump 来自https://meowni.ca/posts/part-theme-explainer/,尝试了以下,但我不知道这个选择器是否仍然是实验性的?,如果它有效,它真的会让我的组件的样式更容易!

此屏幕来自讨论它的以下链接

标签: htmlcssweb-componentshadow-dom

解决方案


遗憾的是 ::theme 选择器没有成功

经过大量挖掘,我发现 ::theme 选择器是一个没有得到实现的提案
虽然这里提到了https://developer.mozilla.org/en-US/docs/Web/CSS/::part在底部的“另请参阅”下。然后我发现这个解释器问题已关闭,确认 ::theme 没有做出削减https://github.com/fergald/docs/issues/4
::theme 选择器也因此不在 CSS 的文档中自 2020 年 9 月 15 日起 CSS W3C 编辑草稿的阴影部分,请参见下文:
https ://drafts.c​​sswg.org/css-shadow-parts/

我不知道是否有人会拿起火炬并实现这个伪选择器,但我确实希望如此,因为我会看到它经常使用,至少在我的需要中。

希望这个问题和答案能帮助其他人,而不是花大量时间进入这个兔子洞:)


推荐阅读