如何设计html“SELECT”元素的样式？

Question

如何设计html“SELECT”元素的样式？

这是我的HTML：

<select id="ddlProducts" name="ddProducts"> 
    <option>Product1 : Electronics </option>
    <option>Product2 : Sports </option></select>

我想确定产品的名称。“Product 1”、“Product 2”等)粗体，及其类别(即。电子，体育等)斜体，仅使用CSS。我发现了一个老问题，上面提到了使用HTML和CSS是不可能的，但希望现在有一个解决方案。

Answer 1

一般来说，你不能。这个元素是一个“替换元素”的例子，它们依赖于操作系统，不是HTML/浏览器的一部分。它不能通过CSS.有一些替换插件/库，它们看起来像<select>但实际上是由普通的HTML元素能，会，可以被设计成。

Answer 2

您可以在某种程度上对选项元素进行样式设置。使用*CSS标记，您可以在系统绘制的框内设置选项的样式。例子：#ddlProducts&nbsp;*{ &nbsp;border-radius:15px; &nbsp;background-color:red;}看起来是这样的：