CSS 规则 ".drop.a"应用于类 "drag a"

原文 标签 css internet-explorer internet-explorer-9 css-selectors

我有以下 HTML 标记:

<div class="drag a"></div>
<div class="drop a"></div>

我还有以下 CSS 规则,它应该只应用于我的第二个 div:
.drop.a
{
   background-color:red;
}

这工作正常,除了在 Internet Explorer 9 中,CSS 规则同时应用于这两个元素。

为什么是这样?我认为这种 CSS 与所有浏览器普遍兼容?

最佳答案

I thought this kind of CSS was universally compatible with all browsers?



不。 IE up to and including version 6 ignores all class selectors in a chain except the last one. IE9 可能会以 quirks 模式呈现您的页面,这意味着它会像它的前辈一样工作,并对待您的 .drop.a选择器为 .a反而。

尝试向您的页面添加 doctype 声明,看看是否可以修复它。如果您的页面上已经有一个,并且您仍然看到这种行为,则说明有其他问题。

关于CSS 规则 ".drop.a"应用于类 "drag a",我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10124254/

相关文章:

CSS:选择一个元素及其所有后代元素

internet-explorer - 在 IE11 中打开 pdf 时需要禁用 "open , save , save as prompt"

javascript - 使用 javascript 强制 IE9 进入兼容模式

javascript - javascript匿名函数的内容

javascript - 使用jQuery将文本的高度调整为图像的高度

html - 边框和背景图片未显示

jquery - 以 bootstrap x 可编辑形式设置最大长度

javascript - 为什么 Firefox 对 "click"标签上的 "select"事件的 react 与 Webkit 和 IE 不同?

javascript - 在Javascript中注册document.click事件时,如何在IE中正确获取事件目标?

jquery - html5 表单验证(不提交)