如何在所有浏览器中加粗选择的第一个选项?

时间:2011-12-02 13:11:03

标签: html css html-select

我试图加粗选择框的第一个选项,但它只适用于Firefox,而不适用于其他浏览器(Chrome,IE)。这是我试过的代码。

HTML

<select id="htmldisabled">
    <option class="bold">test1</option>
    <option>test2</option>
    <option>test3</option>
    <option>test4</option>
    <option>test5</option>
    <option>test6</option>
</select>

CSS

.bold {
     font-weight:bold;   
}

请参阅jsfiddle上的演示。

4 个答案:

答案 0 :(得分:2)

#htmldisabled:first-child{
    font-weight:bold;
}

答案 1 :(得分:2)

正如您所发现的,它不能跨浏览器完成;)

如果您需要特殊格式或显示

,最好使用selectbox replacement script

答案 2 :(得分:1)

据我所知,除非你设置select标签的样式,否则它在IE中不起作用:

select{
    font-weight:bold;
}

然而,这将影响所有选项。我不知道另一个仅限css的解决方案,但也会对其中的一个感兴趣:)

答案 3 :(得分:-1)

试试吧,

CSS

option:first-child {
     font-weight:bold;   
   }

HTML

<select id="htmldisabled">
    <option>test1</option>
    <option>test2</option>
    <option>test3</option>
    <option>test4</option>
    <option>test5</option>
    <option>test6</option>
</select>