`.prose ol[type="A" s] ` 最后一个 `s` 在 CSS 中是什么意思？

Question

我正在研究 tailwind CSS 排版插件的输出 CSS 代码并发现了这个

https://unpkg.com/@tailwindcss/typography@0.4.1/dist/typography.css

第 33 行

.prose ol[type="A" s] {
  --list-counter-style: upper-alpha;
}

.prose ol[type="a" s] {
  --list-counter-style: lower-alpha;
}

终于有这个小s了，什么意思？

如果我将 VSCode 语法更改为 SCSS，它会输出错误

为什么会这样？

Answer 1

来自https://developer.mozilla.org/en-US/docs/Web/CSS/Attribute_selectors：

Adding an s (or S) before the closing bracket causes the value to be compared case-sensitively (for characters within the ASCII range).

这是一个实验性设置。 MDN 列出了唯一实现它的浏览器是 Firefox。

因此，在大多数浏览器上，您似乎无法根据列表是否设置为具有大写或小写标记（假设他们希望以某种方式匹配）来更改样式，因为如果没有小 s，A 和 a 都会匹配。