这是我的HTML:
<select id="ddlProducts" name="ddProducts">
<option>Product1 : Electronics </option>
<option>Product2 : Sports </option>
</select>
我想让产品的名称(即。'Product1'， 'Product2'，等等)，以及它的类别(即。电子，体育等)斜体，只使用CSS。我发现了一个老问题，提到这是不可能使用HTML和CSS，但希望，现在有一个解决方案。
当前回答
实际上你可以添加:before和:after并设置样式。至少它是有意义的
选择{ 字体大小:18 px; background - color: # ffffff; ｝ 之前选择:{ 内容:“>”; 字体大小:20 px; 显示:没有; padding-right: 10 px; padding-left: 5 px; 颜色:# fff; ｝ 选择:徘徊:{之前 显示:内联; ｝ <select id="ddlProducts" name="ddProducts"> <option>Product1: Electronics </option> <option>Product2: Sports </option> < /选择>
其他回答
似乎我可以直接在Chrome或Firefox中为选择设置CSS。CSS和HTML代码提供如下:
. boldoption { font-weight: bold; 的 选择< > <option>一些规范-字体 <option>另一种规范-字体option</option> <option class=“boldoption”>一些勇敢的选择</option> 选择< - >
可以应用于<option>元素的样式属性很少。
这是因为这种类型的元素是一个“替换元素”的例子。它们依赖于操作系统，不是HTML/浏览器的一部分。它不能通过CSS样式。
有一些替换的插件/库看起来像<select>，但实际上是由常规的HTML元素组成的，可以设置样式。
不，这是不可能的，因为这些元素的样式是由用户的操作系统处理的。MSDN将在这里回答你的问题:
除了background-color和color，通过style对象应用于option元素的样式设置将被忽略。
现在是2017年，有可能针对特定的选择。在我的项目中，我有一个class="variations"的表，选择选项在表单元格td="value"中，选择有一个ID select#pa_color。 option元素还有一个class选项="attached"(在其他类标记中)。 如果用户作为批发客户登录，他们可以看到所有的颜色选项。但是零售客户不允许购买2种颜色的选择，所以我禁用了它们
<option class="attached" disabled>color 1</option>
<option class="attached" disabled>color 2</option>
这需要一点逻辑，但以下是我如何针对禁用的选择选项。
CSS
table.variations td.value select#pa_color option.attached:disabled {
display: none !important;
}
这样，只有批发客户才能看到我的颜色选择。
这是一个html css代码，用于样式选项和选择标签。 选择的选项:背景和粗体 关闭后，它看起来是斜体。
<style>
.mydropdown{
border:none;
border-bottom:2px dotted black;
display:inline;max-width:20%;
font-style: italic;
font-weight: 600;
cursor: pointer;
}
.mydropdown:hover , .myoption:active , .myoption:checked{
border:2px dotted green;
}
.myoption{
font-style: normal;
}
.mydropdown .myoption:checked,
.mydropdown .myoption:hover ,
.mydropdown .myoption:active {
font-style: italic;
font-weight: 600;
}
</style>
