IE 忽略 CSS，即使它具有更高的特异性
我有一些滑动门按钮 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;
}
如果我从声明列表中删除按钮：禁用跨度，它就可以工作！
I have some sliding door button css.. I use a button tag and two inner spans.
I have this to specify the background image of a normal button;
button span {
background: url(button_right.png) no-repeat top right;
}
Which is the default button colour. I then have a 'gray' button (i give the button a class of 'gray').
button.gray span {
background: url(button_right_gray.png) no-repeat top right;
}
For some reason .. IE(8) doesn't like this and ignores the gray css keeping the original image as the background. However, the following "hover" css DOES work in IE;
button.gray:hover span span {
color: #6c6c6c;
background-position: left -29px;
}
I thought that 'button.gray span' has higher specificity than just 'button span' (it does in all other browsers).
EDIT:
Ok, so I've discovered the problem. In my CSS declaration I had the following
button.gray span,
button:disabled span {
background: url(button_right.png) no-repeat top right;
}
If I remove the button:disabled span from the declaration list, it works!
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（4）
IE 不支持
:disabled伪类选择器。 IE 的行为是在遇到无效或无法识别的选择器时跳过整个规则（实际上是 符合规范 - 即使一开始不支持:disabled也不是！），这样就可以解释您所看到的内容。IE does not support the
:disabledpseudo class selector. IE's behaviour is to skip the entire rule when it encounters an invalid or unrecognised selector (which is actually in line with the specification - even if not supporting:disabledin the first place is not!), so that would explain what you're seeing.您尝试过添加 !important 吗？ IE
have you tried adding !important to it? i.e.
您尝试过查看图像本身吗？使用颜色而不是图像，ie8 似乎可以很好地显示 .gray 类：
http://screencast.com/t/ YzA4MGEx
Did you try looking at the image itself? Using colours instead of images, ie8 seems to display the .gray class fine:
http://screencast.com/t/YzA4MGEx
根据我的编辑；
好的，所以我发现了问题。在我的CSS声明中，我有以下
button.gray跨度，
按钮：禁用跨度{
背景： url(button_right.png) 右上角无重复；
如果
我从声明列表中删除按钮：禁用跨度，它就可以工作！ IE 的 Button:disabled 问题是什么，因为它完全停止监听整个声明？
As per my edit;
Ok, so I've discovered the problem. In my CSS declaration I had the following
button.gray span,
button:disabled span {
background: url(button_right.png) no-repeat top right;
}
If I remove the button:disabled span from the declaration list, it works! What is IE's issue with button:disabled as it completely stops listening to the entire declaration?