时间戳

首页 > 解决方案 > 无法突出显示下拉焦点

css - 无法突出显示下拉焦点

问题描述

我试图在页面加载时突出显示选择标签的下拉菜单。我在选择标签中有多个类，我尝试将焦点应用于所有类，但没有奏效。任何人都可以看看吗？

div.cs-select select:focus {
  outline: thin dotted;
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
}
<div id="originalAmount_@differAmountId" class="divoriginalAmount">

  <select class="cs-select cs-skin-border billAccountAmount " data-label="@StringResource.Lbl_Pay " id="@Html.IdFor(m => Model.AmountOptionList)">

标签： cssselectbootstrap-4focusautofocus

解决方案

这是你必须做的事情javascript。

document.getElementById("AmountOptionList").focus();
div.cs-select select:focus {
  outline: thin dotted;
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
}
<div id="originalAmount_@differAmountId" class="divoriginalAmount">

  <select class="cs-select cs-skin-border billAccountAmount " data-label="@StringResource.Lbl_Pay " id="AmountOptionList">
    <option>Options</option>
  </select>

</div>

推荐阅读