css - 边框在 IE 中不起作用

Question

我想将边框应用于元素

有.xforms-required类而不是span元素或
input.xforms-required具有类的元素的后代元素

所以我想出了

.xforms-required:not(span), .xforms-required input {
    border: 1px solid gold !important;
}

这是小提琴。

它在 Firefox 18.0.1 中运行良好，但在 IE 中无法运行（在 IE 8 中测试）。不确定 CSS 选择器或border属性是否有问题。

在 IE 中遇到 jsFiddle 的一些问题，所以写了一个简短的片段

<html>
    <body>
        <style>
            .xforms-required:not(span), .xforms-required input {
                border: 1px solid gold !important;
            }
        </style>
        <span class="xforms-required">
            <input>  // This should get border 
        </span>    
        <input class="xforms-required"> // This should get border    
    </body>
</html>

抱歉，这可能是个愚蠢的问题，但不是 CSS 人，所以..

正如Adrift指出的那样，:not()在 IE9+ 中受支持，在 IE7+ 版本中实现相同的任何其他替代方案

score 3 · Accepted Answer

怎么样：

input.xforms-required, .xforms-required input {
    border: 1px solid gold;
}

可选的：

span.xforms-required {
    border: none;
}

score 2 · Accepted Answer

将评论转换为答案：IE8 不支持:not(). 您将需要找到其他方式来定义您的选择器。也许input.xforms-required, .xforms-required input

css - 边框在 IE 中不起作用

2 回答 2

Related