Html 如果元素具有特定同级，则添加样式

我有以下html结构：

<div class="unit">
   <span class="error"></span>
   <input type="text" class="textInput"/>
</div>

仅当验证限制被打破时，我才添加跨度

因此，如果验证通过，我将呈现以下html：

<div class="unit">       
   <input type="text" class="textInput"/>
</div>

如果css中有类

错误的同级span，有没有办法在css中为输入绘制红色边框

.unit span.error + input.textInput{border:1px solid red;}

或

你可以试试选择器

考虑以下代码：

.error + input.textInput {
    border: 1px solid red;
}

这将选择前面紧跟着.error节点的所有.textInput节点。
对不起，我指的是边框，不是轮廓。
.error + input.textInput 
{
   border:1px solid red;
}

.error + input.textInput {
    border: 1px solid red;
}