html - "adjacent"元素的 CSS 选择器

Question

需要一些关于 CSS 选择器的帮助，因为我还不确定如何在 CSS 中表达它。当 :invalid 伪类出现在 input 元素上时(当然在没有 时被隐藏)，我如何让最后一个跨度“错误”显示出来:invalid 存在)？没有 Javascript，请只有 CSS。

<div class="row-fluid">
    <div class="control-group control-field-nickname">
        <span class="span3 offset1">
            <label>{{ msgs.mid("nickname") }}</label>
        </span>
        <span class="span3 input-prepend">                              
            <i class="add-on icon-user"></i>
            <input class="form-field" type="email" id="field-nickname">
        </span>
        <span class="span1">Error!</span>
    </div>
</div>

Answer 1

你不能。

CSS 没有表示“包含”的选择器/组合器，因此您不能说“与包含无效输入的跨度相邻的跨度”。

建议subject Selectors Level 4 的功能将允许您选择出现在选择器中的最后一个元素以外的元素，但(AFAIK)不允许您先上后下。