更改输入组插件颜色时：专注于输入？使用纯 CSS答案

【问题标题】：Change Input-Group-Addon Color when :focus on input? With Pure CSS更改输入组插件颜色时：专注于输入？使用纯 CSS
【发布时间】：2018-03-27 17:43:21
【问题描述】：

当专注于使用纯 CSS 而没有 jQuery / Javascript 的输入表单时，有没有一种方法可以更改 input-group-addon 图标颜色？我只找到了使用 jQuery 的方法，只是想知道是否可以只使用 CSS。如果是这样，我使用什么 CSS？我试过了：

.form-control input:focus + .input-group-addon {
    color: #4183D7;
}

这行不通。我可以尝试什么？

【问题讨论】：

你是在插件前还是插件后使用文本框？
你可以试试这个js来创建这样的css。 https://github.com/Idered/cssParentSelector
@chiragsatapara 之前
@chiragsatapara 整个想法是不使用任何 js，只使用纯 css

标签： css twitter-bootstrap

【解决方案1】：

<input type="email" placeholder="Your email" class="form-control">
<span class="input-group-addon">@</span>

.form-control:focus + .input-group-addon {
    color: #4183D7;
}

这应该可以。

【讨论】：