Sass中的焦点选择器

Question

我专注于输入字段，需要更改该类的图标颜色和边框底部。我该如何在Sass中进行操作？我已经尝试过：

input
 + .input-group-addon // this is icon class
   &:focus
    border-bottom: solid 2px #004eff

但是它什么也没做。请你帮助我好吗？这就是HTML的外观。

<div class="form-group" class="col-md-offset-1 col-xl-offset-1  focus-icon">
      <div class="input-group">
        <div class="input-group-addon man-icon"></div>
        <input type="email" placeholder="?????"  required>
      </div>
    </div>

Answer 1

尝试这个。 编辑：我错过了。当我粘贴答案时。

.input-group
  input
    &:focus
      & + .input-group-addon
        border-bottom: solid 2px #004eff

在这里，您可以看到SASS生成的CSS的作用。 注意： “图标”在DOM中的位置已移动。

.input-group
  input
    &:focus
      & + .input-group-addon
        border-bottom: solid 2px #004eff

.input-group input:focus+.input-group-addon {
  border-bottom: solid 2px #004eff;
}