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

Posted 2023-03-07

【中文标题】`.prose ol[type="A" s]`最后一个`s`在CSS中是啥意思？

【英文标题】：What does `.prose ol[type="A" s] ` the last `s` mean in CSS?`.prose ol[type="A" s]`最后一个`s`在CSS中是什么意思？

【发布时间】：2021-11-01 12:53:58

【问题描述】：

我在研究 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，它会输出错误

为什么会这样？

【参考方案1】：

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

在右括号前添加一个 s（或 S）会使值区分大小写（对于 ASCII 范围内的字符）。

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

因此，在没有little s A 和 a 都会匹配。