问题标签 [css-specificity]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
css - z-index 和多个 !important 规则的问题
有没有人遇到过更具体的!important声明没有覆盖另一个!important声明的情况？这是基本的CSS：
这是我想用来覆盖 z-index 的内容：
当我通过 Windows 上的 Chrome（或 Safari）调试器进行检查时，我看到.x-msgbox.x-floating声明被覆盖（划掉），并且x-floating声明处于活动状态。这违背了我对 css 特异性的了解，以及我对简化测试的期望。
示例代码：
由于我使用的是 Sencha，这只能在 Chrome 或 Safari 中使用，但这里有一个jsFiddle 链接（可能不符合热链接 Sencha 的源代码，但这永远不会获得足够的视图来解决它的问题）。要运行测试，请单击“选择日期”按钮，然后通过拖动旋转其中一个轮子。将出现一个消息框。比较消息框和日期选择器（每个的顶级元素——body 的子元素；另一种方法是查找带有 class 的元素x-floating）。
css - !important 和 CSS 特异性之间的关系
查看CSS specificity specification，没有提到该!important规则值多少“点”。
什么时候覆盖另一个？如果一个接着一个声明会发生什么？哪个规则被宣布为更重要？有某种模式吗？
从它的外观来看，!important适用于具有更多特异性点的开始。但是，如果我声明一个与类堆叠在一起并嵌套很深的 id 会发生什么？它会覆盖在另一个标有 的、较少指定的规则中设置的规则!important吗？
css - 关于令人困惑的 CSS 特异性规则的问题，（来自 SAMS 在 24 小时内自学 CSS 第二版一书。）
这是本书给出的关于浏览器如何确定在冲突中应用哪个规则的 5 条规则中的第 2 条：
id 选择器是第二个最具体的 [在行内样式属性之后]。如果规则中有多个 id，则 id 选择器数量最多的规则获胜。
我真的不明白规则 2 在说什么——它说“如果规则中有多个 id ”（这是单数）。如果只有一个规则，怎么会有冲突或比较（“最大的规则……获胜”）？一条规则怎么会有不同数量的 id 选择器，如果只有一条规则，冲突在哪里？
有人可以彻底解释这条规则吗？感谢您的帮助，因为我正在尝试了解网页设计的基础知识
css - CSS 和特异性 - 类 vs id
考虑以下 html：
以及以下CSS：
“应该加下划线”链接没有下划线，不应该是因为它继承了类 barLinks 和 id rightbar。'#rightBar a.barLinks' (0, 1, 1, 1) 比 '#rightBar a' (0, 1, 0, 1) 具有更多的特异性，所以它应该覆盖后者，对吧？
在不使用任何内联规范（css或html）的情况下，我如何才能在“应该下划线”链接下划线
css - CSS继承和特异性
我在使用 CSS 样式表时遇到了问题。我已将其范围缩小到关于 CSS 样式的继承和特殊性。
现在（简化）我有一个<body>如下所示的 HTML：
现在，这是需要在多个网站上使用的 uni-login 表单的一部分，因此它有一个用于特定 unilogin 样式的单独样式表。但是在网站样式表（style.css）中设置了以下内容：
在 unilogin 样式表 (unilogin.css) 中设置了以下内容：
但是，这不会覆盖从 style.css 继承的 h1 样式。如果我#page-wrap h1.unilogin-h1{}改为它工作得很好。虽然这不是一个选项，因为它必须在几个网站上工作，这些网站都具有不同的样式表，我不能只是改变。
是否有任何方法可以在不使用内联 html 样式的情况下覆盖第二个样式表中继承的 h1 样式的特异性？（我知道 style="" html 属性具有更高的特异性，但我更喜欢将样式保留在样式表中）。
谢谢...
html - CSS !important rule not overriding text alignment
This is a compact version of what I have and for me, using Firefox 5, the links are STILL centered, even though I I'm using !important on the "text-align: left". It's confusing and irritating because i thought !important was the highest specificity and overrode all other rules.
What's wrong here?
javascript - text-decoration:none 不删除文本装饰
考虑以下代码 HTML：
<span class='c1'>Home<sup id='id1'>[2]</sup></span>
CSS：
现在我希望Home有一个下划线，而上标[2]没有下划线。但碰巧上标也有下划线。我在这里想念什么？
css - 关于 CSS 特异性的具体问题
我有一个关于 CSS 特异性的非常具体的问题，我无法清楚地理解； http://coding.smashingmagazine.com/2007/07/27/css-specificity-things-you-should-know/
如果我有 2 个定义不矛盾的属性/属性的选择器，这两个属性是否仍然会被应用或者它的工作方式是，它只是比较选择器，而不会打扰它们内部定义的内容。
所以，如果我们有；
这里两个选择器都引用“menu1”，但定义了不相关的属性（颜色/字体大小）
所以我的问题是特异性仍然重要吗，只有 2 中的 1 会被考虑？我的问题更多是关于实际实施是如何发生的。
css - 基于样式表中的顺序的CSS特异性/优先级？
我简要查看了CSS3 选择器规范，但找不到任何解决此问题的方法。此外，当您移动 CSS 声明时，我没想到结果会发生变化，但确实如此。任何帮助都会很棒。
css - 在某个元素下重置和推翻 CSS
我有可以使用 Firefox 插件注入任何页面的元素。
自然，它和它的祖先会受到该页面上定义的 CSS 规则的影响。
我可以通过简单地明确每个属性来做到这一点，但即便如此，我的声明也可能被页面上更早的更具体的声明所覆盖。
如果不把不必要的特定选择器和 hanus 使用弄得一团糟，!important我怎么能在给定元素 ( div#my_root_container_element) 下重置所有元素的属性并确保我在此父元素下的声明适用。
使用 iFrame 是一种选择，但如果可能的话，我宁愿避免使用它——还有其他方法吗？给定应用程序，解决方案只需要在 Firefox 中运行。
谢谢。