css - IE 忽略 CSS，即使它具有更高的特异性

Question

我有一些滑动门按钮 css。我使用一个按钮标签和两个内部跨度。

我有这个来指定普通按钮的背景图像；

button span {
 background: url(button_right.png) no-repeat top right;
}

这是默认按钮颜色。然后我有一个“灰色”按钮（我给按钮一个“灰色”类）。

button.gray span {
 background: url(button_right_gray.png) no-repeat top right;
}

出于某种原因.. IE(8) 不喜欢这样，并忽略了保留原始图像作为背景的灰色 css。但是，以下“悬停”css 在 IE 中有效；

button.gray:hover span span {
      color: #6c6c6c;
      background-position: left -29px;
  }

我认为'button.gray span'比'button span'具有更高的特异性（它在所有其他浏览器中都有）。

编辑：好的，所以我发现了问题。在我的 CSS 声明中，我有以下内容

button.gray span,
  button:disabled span {
background: url(button_right.png) no-repeat top right;
}

如果我从声明列表中删除 button:disabled span，它可以工作！

score 2 · Accepted Answer

IE不支持:disabled伪类选择器。IE 的行为是在遇到无效或无法识别的选择器时跳过整个规则（这实际上符合规范- 即使:disabled一开始不支持也不支持！），这样就可以解释您所看到的。

score 0 · Accepted Answer

您是否尝试过添加 !important ？IE

    button.gray span {
      background: url(button_right_gray.png) no-repeat top right !important;
    }

score 0 · Accepted Answer

根据我的编辑；

好的，所以我发现了问题所在。在我的 CSS 声明中，我有以下内容

button.gray span, button:disabled span { background: url(button_right.png) no-repeat top right; }

如果我从声明列表中删除 button:disabled span，它可以工作！IE 的 button:disabled 问题是什么，因为它完全停止收听整个声明？

score 0 · Accepted Answer

您是否尝试查看图像本身？使用颜色而不是图像，ie8 似乎可以很好地显示 .gray 类：

4 回答 4