由于多个样式表，css选择器特异性冲突

Question

好的，我一直在阅读stackoverflow css选择器。在线程here这个语法有什么不同？ ^ =是什么意思？选择什么？所有？

[class^='Rating'] 

和

div.Rating0_5

此外，还有一条声明here，内容如下： 注意：允许重复出现相同的简单选择器，并提高特异性。

这是什么意思？

我问，因为我不得不在网站上清理很多CSS代码。有十几个样式表，每个样式表包含200多行代码，并且样式表中的样式相互覆盖，如果重复出现会增加特异性，甚至可能在其中。通过样式表一行一行地找出特定的类，div等是否会超越另一个，并且一些特殊性是七个选择器深度，这是艰辛的！这对我来说几乎是不可能的，而且非常紧张。

是否有一种工具可以用来覆盖其他样式的样式？它易于使用吗？它究竟做了什么？如果没有，我如何编写具有足够特异性的CSS而不需要非常长的选择器来希望确保唯一性，以便它们不会被另一个规则样式表覆盖？

谢谢，我希望这有一定道理并且有人有这种经历。

Answer 1

对于CSS选择器，

^ =是“以...开头”。在您的情况下，它将适用于名称以“rating”开头的类。

使用传统的CSS，您必须使特别长的选择器具体化，我认为该语句意味着您可以拥有重复的选择器，并且样式将被组合。

在清理CSS方面，我对自动化工具没有很好的建议，但你可以看看http://sass-lang.com/（SCSS）在CSS上做一个更好的语法层，它可以做变量和选择器的继承。清理CSS很多。