IE9忽略CSS3：not（）选择器

Question

CSS：

input:not([type=submit]):focus,
input:not([type=file]):focus,
textarea:focus {
    background: #f8f8f8;
    -webkit-box-shadow: 0 0 5px 0 rgba(67,67,67,0.3);
    box-shadow: 0 0 5px 0 rgba(67,67,67,0.3);
    outline-color:transparent;
    outline-style:none;
}

IE9忽略input:not([type=file]):focus并设置其框阴影，背景等在输入文件焦点上的样式。

有什么想法怎么了？

编辑：

如果不支持它：为什么IE9像上面那样样式？ 如果受支持：为什么IE9忽略：not（）？ 和上面的样式一样？

Answer 1

IE9当然支持:not选择器-caniuse （如注释中所述）

然而...

您的CSS并没有按照您的想法做。

在您当前的代码中，第二条规则是：

input:not([type=file]):focus

覆盖第一条规则。 因此，这些属性将应用于除文件（但包括提交）以外的所有输入元素，并应用于所有浏览器（不仅限于IE9）

相反，您应该像这样链接选择器：

input:not([type=submit]):not([type=file]):focus, 
textarea:focus {
    background: #f8f8f8;
    -webkit-box-shadow: 0 0 5px 0 rgba(67,67,67,0.3);
    box-shadow: 0 0 5px 0 rgba(67,67,67,0.3);
    outline-color:transparent;
    outline-style:none;
    color: pink;
}

签出此FIDDLE ：

...您可以看到类型为commit和file的输入不会将样式应用于焦点，但是类型按钮的输入将会将样式应用于焦点。

我在IE9中测试了它，效果很好。