有没有办法设置<select>下拉选项容器和项目的样式？

Question

我在wordpress上使用联系表单7，我不想使用插件而是使用普通的css / js来尽可能地提供结果。 像这样的东西：

Answer 1

所有浏览器定义彼此选择不同。 您可以使用UL和LI进行自定义选择列表。

这是一个example，这可以帮助您在所有浏览器和移动设备上使所有选择看起来类似。

选择将是：

<ul>
    <li class="init">[SELECT]</li>
    <li data-value="value 1">Option 1</li>
    <li data-value="value 2">Option 2</li>
    <li data-value="value 3">Option 3</li>
</ul>

Answer 2

如果你给你下拉一个id，那么你可以使用jQuery选择id并使用它的children方法。您甚至可以指定哪个孩子。

这样的事情：

$（＆＃34; dropdownId＆＃34;）。children（）。css（{＆＃34; color＆＃34;：＆＃34; yellow＆＃34;，＆＃34; border＆＃34;：＆ ＃34; 1px纯红色＆＃34;}）;