Bootstrap，我创建了一个下拉菜单，如何在悬停时突出显示选项？

Question

我创建了一个下拉菜单，当您单击文本框时会打开它，然后当您为该下拉列表选择一个字符串时，它会将其放入文本框中。
我想这样做，当您将鼠标悬停在下拉列表中的字符串上时，它们会略微突出显示！我怎样才能做到这一点？

<div class="row">
    <div class="col-xs-12 max300" uib-dropdown is-open="vm.descriptionDropdownOpen">
         <textarea name="remarks" class="form-control" ng-model="vm.presence.description" ng-click="vm.toggleDescriptionDropdown()" autofocus></textarea>
         <ul id="descriptionDropdown" uib-dropdown-menu>
             <li ng-repeat="descr in vm.loadedDescriptions" ng-click="vm.presence.description = descr.text; vm.descriptionDropdownOpen = false;">
                 {{descr.text}}
             </li>
         </ul>

以及保持下拉菜单与文本框对齐的 css：

#descriptionDropdown {
    width: 100%;
    line-height: 150%;
    padding-left: 8px;
    position: relative;
}

非常感谢

Answer 1

你可以这样做

#descriptionDropdown li:hover{
   background-color:#eaeaea;
}

将颜色代码更改为您想要的颜色代码。 并从ul 中删除padding 以避免悬停时背景周围的空间。相反，在li 上使用padding

#descriptionDropdown li{
   padding-left:8px;
}

Answer 2

你可以添加这个 css ：

li:hover {
  background-color: blue;
}