CSS 正则表达式标志：忽略大小写，全局搜索

Question

我有以下 HTML:

<div>
    <img class="hi" src="http://i.imgur.com/f9WGFLj.png"></img>
    <img class="HI" src="http://i.imgur.com/f9WGFLj.png"></img>
</div>

以及以下CSS：

img {
    height:200px;
    width:auto;
}

img[class*='i'] {
    outline:red inset;
}

img[class*='I'] {
    outline:green inset;
}

img[class*=/'i'/i] {
    outline:blue inset;
}

如您所见，在最后一个 CSS 片段中，我试图（不熟练地）覆盖之前的片段作为概念证明。问题是这样的：

CSS 与 "ignore case" 和 "global search?" 等正则表达式标志兼容如果是，如何使用它们？

单独说明（所有这一切的最终目标是获得 CSS 完全删除包含 "autoplay=1" 的 iframe 的代码），CSS 可以停止自动播放吗？

Answer 1

据我所知，您不能在 CSS 中使用实际的正则表达式，只有一个叫做 "Substring matching attribute selectors" 的东西，它的工作原理如下：

[attribute^='...'] /* attribute value starts with '...' */
[attribute$='...'] /* attribute value ends with '...' */
[attribute*='...'] /* attribute value contains '...' */

但是您已经在第二个和第三个选择器中这样做了。

关于你的其他问题

Can CSS halt autoplayback?

不，据我所知没有。

您可以使元素不可见，但这不会停止播放音频。
此外，对于您的示例，目前无法 "descend" 进入带有 CSS 的 iframe。也许当 Shadow DOM 支持进步时会有可能，但我怀疑它是否会跨源工作。

您需要 JavaScript 来检测和停止自动播放的元素，但这也只适用于同源，因为您无法访问不同来源的帧。
如果页面是同源的，您也可以从该站点删除自动播放元素...

这里唯一的 "solution" 可能是在服务器端获取 iframe 内容，去除所有不需要的内容并将结果嵌入您的页面。

CSS 正则表达式标志：忽略大小写，全局搜索

CSS regular expression flags: ignore case, global search

html

css

regex

flags