css - 如何以编程方式在所有现有 CSS 选择器中插入父元素

Question

我有一个包含 1000 多个选择器的大型 CSS 文件。我想将 ID MyId 作为父元素添加到所有选择器。

例如:

p{
...
}
.myclass li{
...
}

将变成:

#MyId p{
...
}
#MyId .myclass li{
...
}

有没有办法自动执行此操作，例如在 PhpStorm 或工具中？

Answer 1

您可以使用带有正则表达式选项的替换。

查找:^(.*)\{$

替换:#MyId $1{

这将匹配所有开始的 CSS 行例如[selector] { 并在其前面加上 #MyId。

我建议考虑使用 SASS 来更好地控制编译 css 文件。

Note: this will not fix compound selectors such as html, body {, which will only prefix the compound value as #MyID html, body {