css - CSS 选择器中的 OR 语句

Question

有人可能会使用 CSS 选择器a[href^="http:"], a[href^="mailto:"]来匹配文档中的所有外部链接和邮件链接，但是有没有办法在选择器的引号部分中使用“或”语句，如下所示a[href^="(http|mailto):"]：

Answer 1

据我所知，没有办法按照你的要求去做。在 CSS 选择器规范中，管道字符在与属性选择器一起使用时用于不同的用途。它用作命名空间分隔符。

根据 W3C 上的选择器规范：

属性选择器中的属性名称作为 CSS 限定名称给出：先前已声明的名称空间前缀可以添加到由名称空间分隔符“竖线”(|) 分隔的属性名称之前。为了与 XML 建议中的命名空间保持一致，默认命名空间不适用于属性，因此没有命名空间组件的属性选择器仅适用于没有命名空间的属性（相当于“|attr”；这些属性被称为“每个元素类型的命名空间分区”）。星号可用于命名空间前缀，表示选择器将匹配所有属性名称，而不考虑属性的命名空间。

CSS examples:

@namespace foo "http://www.example.com";
[foo|att=val] { color: blue }
[*|att] { color: yellow }
[|att] { color: green }
[att] { color: green }

第一条规则将仅匹配“ http://www.example.com ”命名空间中属性 att 且值为“val”的元素。

第二条规则将只匹配具有属性 att 的元素，而不考虑属性的命名空间（包括无命名空间）。

最后两个规则是等效的，并且将仅匹配具有属性 att 的元素，其中该属性不在命名空间中。

资料来源：http ://www.w3.org/TR/selectors/#attrnmsp

Answer 2

我正在检查 CSS 选择器语法，但似乎唯一的方法是使用逗号分隔符：

selectors_group
  : selector [ COMMA S* selector ]*

此外，这些是一些相关的词汇规则：

{w}"+"           return PLUS;
{w}">"           return GREATER;
{w}","           return COMMA;
{w}"~"           return TILDE;

没有AND或OR规则，但我注意到的一件事是它们有否定：

"{N}{O}{T}"("  return NOT;)

http://www.w3.org/TR/selectors/#w3cselgrammar