html - Bootstrap:当鼠标移开时，为什么输入组按钮恢复为默认的灰色？

这是我的问题的可视化：


我试图通过使用CSS更改默认的灰色背景颜色。即使我更改了Add-Button和Remove-Button的背景颜色，默认的灰色背景似乎仍会保留。我真的很感谢您的帮助！

的HTML

<div class="row">
        <div class="col-lg-7">
          <div class="form-group">
            <div class="input-group input-group-lg">
              <div class="input-group-btn">
                <button type="button" id="Remove-Button" class="btn btn-default" aria-label="Remove">
                  <span class="glyphicon glyphicon-minus-sign" aria-hidden="true"></span>
                </button>
              </div>
              <input type="text" name="Worksheet-Problem" class="form-control" placeholder="Problem..." aria-label="Write worksheet problem here">
              <div class="input-group-btn">
                <button type="button" id="Add-Button" class="btn btn-default" aria-label="Add">
                  <span class="glyphicon glyphicon-plus-sign" aria-hidden="true"></span>
                </button>
              </div>
            </div>
          </div>
        </div>
      </div>

CSS颜色按钮部分

/*Color button & icons*/

#Add-Button:hover {
  background-color: #E5FFFB;
}

#Remove-Button:hover {
  background-color: #FCC1C5;
}

JSFiddle of my code

最佳答案

您可能输入的代码#Add-Button:hover, #Add-Button:focus { background: ... }

关于html - Bootstrap:当鼠标移开时，为什么输入组按钮恢复为默认的灰色？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/38132228/