样式选定的选项 [英] Styling selected option

问题描述

自我解释很清楚，我需要设置用户选择的选项的样式.没有javascript，这可能吗?

Pretty self explaining, I need to style the option that is selected by the user. Is this possible without javascript?

简单的例子:

HTML:

<select multiple>
    <option class="opt1" value="">Option 1</option>
    <option class="opt2" value="">Option 2</option>
</select>

CSS:

.opt1[selected]{
    background-color: red;
}
.opt2{
    background-color: green;
}

JS小提琴示例

JS Fiddle Example

推荐答案

尝试一下.

<style>
.your-select option:checked {background:#333;padding:20px;width:100px;border:3px solid #F00}
</style>


<select multiple class="your-select">
    <option class="opt1" value="">Option 1</option>
    <option class="opt2" value="">Option 2</option>
</select>

这篇关于样式选定的选项的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！