用于选择输入的自定义选项背景

问题描述 投票:0回答:1

我正在尝试以HTML形式自定义标签。我希望选择输入中的每个选项都具有不同的背景色。我开始使用this link,然后尝试对其进行更改,但随后完全消失了。我知道HTML,CSS和JS。我的选择菜单具有不同的颜色,每种颜色应选项应具有该颜色背景。例如,“红色”选项将具有带有白色文本的红色背景等。

这是我的代码:

<select>
    <option style="background-color: #fff;" value="0">Select colour:</option>
    <option style="background-color: #00f;" value="1">Blue</option>
    <option style="background-color: #fff;" value="2">White</option>
    <option style="background-color: #f40;" value="3">Orange</option>
    <option style="background-color: #0f0;" value="4">Green</option>
</select>

但是这没有任何作用。我想在使用尽可能少的语言的同时做到这一点。任何想法这是否可能?谢谢

html css html-select
1个回答
0
投票

最简单的方法是给每个选项一个单独的ID,例如<option id="red"></option>。然后在页面的<head> </head>中,您将输入如下内容:

<style>

#red { 
background-color: red;
}

#green{ 
background-color: green;
}

#yellow{ 
background-color: yellow;
}

</style>

如果这不是您的意思,请发表评论!

© www.soinside.com 2019 - 2024. All rights reserved.