2

我想将边框应用于元素

  1. 有.xforms-required类而不是span元素或
  2. 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+ 版本中实现相同的任何其他替代方案

4

2 回答 2

3

怎么样：

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

可选的：

span.xforms-required {
    border: none;
}
于 2013-06-05T12:36:44.933 回答
2

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

于 2013-06-05T12:36:25.520 回答