如何设置html“选择"选项的样式元素? [英] How to style the option of an html "select" element?

问题描述

这是我的HTML:

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

我想仅使用CSS将产品名称(即"Product1"，"Product2"等)加粗，并将其类别(即电子产品，体育等)斜体化.我发现一个老问题，提到无法使用HTML和CSS，但希望现在有解决方案.

I want to make the name of the product (i.e. 'Product1', 'Product2' , etc) bold, and its categories(viz. Electronics, Sports, etc) italicized, using CSS only. I found an old question that mentioned it's not possible using HTML and CSS, but hopefully, there's a solution now.

推荐答案

只有少数样式属性可以应用于<option>元素.

There are only a few style attributes that can be applied to an <option> element.

这是因为这种类型的元素是已替换元素"的示例.它们与操作系统有关，不属于HTML/浏览器.不能通过CSS设置样式.

This is because this type of element is an example of a "replaced element". They are OS-dependent and are not part of the HTML/browser. It cannot be styled via CSS.

有些替换插件/库看起来像<select>，但实际上是由可以设置样式的常规HTML元素组成的.

There are replacement plug-ins/libraries that look like a <select> but are actually composed of regular HTML elements that CAN be styled.

这篇关于如何设置html“选择"选项的样式元素?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！