相关疑难解决方法(0)

是否有一种仅限CSS的方式来设置<select>下拉列表的样式？

我需要<select>尽可能多地为一个表单设置样式,而不需要任何JavaScript.我可以在CSS中使用哪些属性？

此代码需要与所有主流浏览器兼容:

• Internet Explorer 6,7和8
• 火狐
• 苹果浏览器

我知道我可以使用JavaScript:示例.

我不是在谈论简单的造型.我想知道,只有CSS才能做到最好.

我在Stack Overflow上发现了类似的问题.

而这一次在Doctype.com.

这是我的HTML:

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

现在,我想要的是将产品的名称(即'Product1','Product2'等)加粗,并使用css将其类别(即电子,运动等)斜体化.我发现了一个关于一岁的类似问题,但正如那里提到的那样,使用HTML和CSS是不可能的.希望现在有一个解决方案.任何提示,怪癖或技巧将不胜感激.谢谢.

注意:此问题与制作自定义下拉列表无关.它只是关于<option>CSS中select元素中样式元素的可能性

如何使用跨浏览器兼容性<option>来设置<select>元素的样式？我知道很多JavaScript方法可以自定义下拉列表以进行转换<li>,我不会问.

<select class="select">
    <option selected>Select</option>
    <option>Blue</option>
    <option >Red</option>
    <option>Green</option>
    <option>Yellow</option>
    <option>Brown</option>
</select>

我问的是,只有CSS可以实现什么,兼容IE9 +,Firefox和Chrome.

我希望这样或尽可能接近样式.

我在这里试过http://jsfiddle.net/jitendravyas/juwz3/3/,但除了字体颜色外,Chrome没有显示任何样式,而Firefox则显示更多.如何在Chrome中获得边框和填充功能？

我正在尝试在Google Chrome option中的select下拉菜单中设置a的样式.它适用于除IE9和Chrome之外的所有浏览器.

option.red {
    background-color: #cc0000; 
    font-weight: bold; 
    font-size: 12px; 
    color: white;
}

<select name="color">
    <option class="red" value="red">Red</option>
    <option value="white">White</option>
    <option value="blue">Blue</option>
    <option value="green">Green</option>
</select>

如果不使用JavaScript,有没有办法为Google Chrome中的选项设置样式？选择后,不显示背景颜色.