首页 > 解决方案 > 如何使用选择删除自定义样式

问题描述

我对选择样式有疑问。我使用引导程序。我想从所选选项中删除样式

在此处输入图像描述

如何去除这个灰色背景?我想要它是蓝色的。

这是我的html代码

   <select multiple id="select" name="price" class="form-control currency-selector">
       <option value="$10000-$15000">$10 000 - $15 000</option>
        <option value="$15 000 - $30 000">$15 000 - $30 000</option>
        <option value="$30 000 - $50 000">$30 000 - $50 000</option>
        <option value="$50 000+">$50 000+</option>
     </select>

.currency-selector {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: transparent;
  border: $input-border-width solid $input-border-color;
  border-radius: 0.5rem;
  color: $logan;
  font-size: 0.8125rem;
  overflow-y: auto;
  padding-left: 1.5rem;
  position: absolute;
  top: -2.625rem;

  option {
    padding: 10px 0;
  }
}

标签: jquerycsstwitter-bootstrap

解决方案


您可以使用以下 CSS :

select#select option{
background: blue;}

并更改您可以在 CSS 下面使用的选项的悬停颜色:

    select#select option:hover {
box-shadow: 0 0 10px 100px blue inset;}

推荐阅读