由于多个样式表，CSS 选择器特异性发生冲突
好的，我一直在阅读 stackoverflow css 选择器。在线程此处此语法有什么区别？ ^= 是什么意思？它在选择什么？全部？
[class^='Rating']
另外
div.Rating0_5
，这里有一个声明： 注意：允许重复出现相同的简单选择器，这确实会增加特异性。
这是什么意思？
我这么问是因为我必须清理网站上的大量 CSS 代码。有十多个样式表，每个样式表包含 200 多行代码，并且样式表之间存在相互覆盖的样式，如果重复出现会增加特异性，甚至可能在样式表内部相互覆盖。逐行浏览样式表以找出哪些特定的类、div 等覆盖了另一个类、div 等是非常困难的，并且某些特殊性是七个选择器的深度！这对我来说几乎是不可能的，而且压力很大。
是否有一个工具可以使用目标样式覆盖其他样式？它是否易于使用以及它的具体用途是什么？如果没有，我怎样才能编写具有足够特异性的CSS，而无需使用极长的选择器来确保唯一性，以便它们不会被另一个规则样式表覆盖？
谢谢，我希望这是有道理的，并且有人有过这种经历。
Ok, I've been reading through stackoverflow css selectors. on the thread here what is the differences in this syntax? What does the ^= mean? What is it selecting? all?
[class^='Rating']
and
div.Rating0_5
Also, there's a statement here that reads:
Note: Repeated occurrances of the same simple selector are allowed and do increase specificity.
What does that mean?
I'm asking because I'm having to clean up alot of CSS code on a website. There are over a dozen stylesheets each containing 200+ lines of code, and there are styles that are overriding each other among the stylesheets, maybe even within them if repeated occurences increase specificity. It's painstaking to go line by line through the stylesheets to find out what particular class, div, etc is over-riding another and some of the specificity is seven selectors deep! It's almost impossible for me and very stressful.
Is there a tool to use that will target styles overwriting other styles? Is it easy to use and what does it do exactly? If not, how can I write my CSS with enough specificity without having extremely long selectors to hopefully ensure uniqueness so that they will not be overwritten by another stylesheet of rules?
Thanks, I hope this makes some sense and someone has had this experience.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
^= 是 CSS 选择器的“开头”。在您的情况下，它将适用于名称以“评级”开头的类。
使用传统的 CSS，你必须制作非常长的选择器才能具体，我认为该声明意味着你可以有重复的选择器，并且样式将被组合。
在清理 CSS 方面，我没有关于自动化工具的好建议，但您可以查看 http: //sass-lang.com/ (SCSS) 在 CSS 之上提供更好的语法层，用于选择器的变量和继承。确实清理了很多CSS。
^= is "starts with" for CSS selector. In your case it will apply to classes with names starting with "rating".
With traditional CSS you do have to make really long selectors to be specific and I think the statement meant you can have duplicate selector and the styling will be combined.
In terms of cleaning up the CSS I don't have a good suggestion for an automated tool but you can take a look at http://sass-lang.com/ (SCSS) for a better syntax layer on top of CSS that does variable and inheritance of selectors. Does clean up CSS a lot.