CSS 样式表定义的顺序重要吗？
我有几个样式表。第一个是样式表，其中包含一些我想用作默认样式的样式。根据多种因素，用于生成页面的代码可能包括一些样式表，其值应覆盖默认值。
如果我使用它，我可以相信默认样式表中的值将被其他样式表中的值覆盖吗？我正在使用类选择器，并且当名称匹配时将覆盖值。
<link href="defaults.css" rel="stylesheet" type="text/css"/>
<link href="valuestooverridedefaults.css" rel="stylesheet" type="text/css"/>
这需要适用于所有浏览器，包括移动设备。如果可能的话，我想避免使用“！important”。
谢谢！
I have several stylesheets. The first one is a stylesheet with some styles that I would like to use as defaults. Depending on several factors, the code being used to generate the page may include some stylesheets with values that should override the defaults.
If I use this, can I trust that the values in the default stylesheet will be overridden by the values from the other stylesheet? I am using class selectors and will override values when the names match.
<link href="defaults.css" rel="stylesheet" type="text/css"/>
<link href="valuestooverridedefaults.css" rel="stylesheet" type="text/css"/>
This needs to work on all browsers, including mobile. I'd like to avoid having to use "!important", if possible.
Thanks!
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（7）
有一个定义的级联，其中样式被排序和应用。
当声明具有相同的重要性（权重）、来源和特异性时，后一个声明获胜。大多数答案都涵盖了重要性和特异性，但没有起源。
这里有一些关于CSS Cascades的非常好的幻灯片。 （概览所有资源）
There is a defined cascade in which the styles are sorted and applied.
When declarations have the same importance (weight), origin and specificity then the latter declaration wins. Most answers cover importance and specificity here but not origin.
Here are some very good slides about CSS Cascades. (Overview all resources)
如果选择器相同，则最后加载的优先，就像您在同一个样式表中两次声明同一个类一样。
If the selectors are identical, the last loaded takes precedence, just as if you declared the same class twice in the same stylesheet.
如果您在多个 css 文件中为选择器定义了样式，则将采用上次加载的 CSS 文件中的样式
If you have defined style for a selector in more than one css file, the style from last loaded CSS file will be taken
正如您所指出的，当第二张纸上的选择器与第一张纸上的选择器相同时，答案是“是”。
使用
!important将是例外，因此请避免使用它，正如您也指出的那样。The answer is "yes", as you noted, when the selectors on the second sheet are identical to the first.
The use of
!importantwill be the exception, so avoid it, as you also noted.是的，这就是样式表的工作原理。最后一名获胜。
只要确保默认样式表的特殊性不大于您的覆盖即可。是的，如果可以的话，避免！很重要。这太愚蠢了。
Yes, that is how stylesheets work. The last one wins.
Just be sure the specificity of the default style sheet isn't greater than your override. And yes, avoid !important if you can. It's just silly.
是的 - 线索就在“级联”样式表这个名字上。因此，内联样式将覆盖头部中定义的样式，头部中的样式将覆盖样式表中的样式。最后加载的样式表可能会覆盖前一个加载的样式。如果您使用 Firebug 或 Chrome 中的检查器之类的东西，它会向您显示每种样式的来源或它覆盖的内容。
yep - the clue is on the name 'cascading' stylesheets. So an inline style will overwrite an style that is defined in the head and a style in the head will overwrite a style in a style sheet. The last style sheet load could overwrite the styles in the previous one loaded. If you use something like firebug or the inspector in chrome it will show you where each style has come from or what it has overidden.
简单的答案是肯定的。页面下方重新声明的任何样式都将覆盖页面加载之前声明的类。
为此，类的第二个声明必须位于继承中。
.content{} 和 .body .content{} 等类在继承样式时可能会有不同的行为。
The simple answer is yes. Any styles re-declared further down the pages will overwrite the classes declared earlier on in the page load.
For this to work the second declaration of the class must be in the inheritance.
Classes like .content{} and .body .content{} may behave differently when inheriting styles.