设置多个选择菜单选项的样式

时间:2017-04-15 18:09:22

标签: javascript css twitter-bootstrap

option:active {
   color: red;
}

option:focus {
   color: green;
   background: green;
}

option:checked {
   color: yellow;
   background: yellow;
}
<select multiple>
 <option>One</option>
 <option>Two</option>
 <option>Three</option>
</select>

我已经尝试了很多次来改变它的风格但是不能并且不能通过这么多方式,也不能活跃,专注,之后,之前的工作,悬停效果完美,但选择的选项和活动所选选项根本无法更改

我想改变的是[当你点击它的蓝色]和[点击其他地方的灰色]之后,我怎么才能改变这两种颜色?

1 个答案:

答案 0 :(得分:0)

     <select multiple>
     <option>One</option>
     <option>Two</option>
    <option>Three</option>

option:not(:checked) { 
    background-color: yellow; 
    color:yellow;
}
option:not(:focus){
background-color:green;
color:green;
}
option:not(:active){
color:red;
}

这可能会与你合作