列表框样式在特定项目（选项）HTML [英] List Box Style in a particular item (option) HTML

问题描述

我试图做这个行为。

当a有一个listBox（或comboBox），我的第一个元素（类似选择一个）应该有一个特定的风格。

When a have a listBox (or comboBox), my first element (something like "choose one") should have a particular style.

使用此测试代码：

<style type="text/css">
 .testX {font-style: italic;}
</style>

(...)

<select name="name" id="id">

<option class="testeX" selected="selected" value="#">
    <p class="testX">Choose One</p>
</option>
<option value="TestValue">
    TestValue
</option>

我可以看到这种行为在Firefox（但不是在Chrome）当我扩展我的列表框，选择我的选择一个我的字段没有（斜体）样式。

i can see this behavior on Firefox (but not in Chrome) when i expand my listBox but when i select my 'Choose one' my field doesn't have the (italic) style.

我该如何做？有可能只用HTML，CSS或者我需要更多的东西（比如jQuery）？

How can i do this? Is possible do this only with HTML, CSS or i need more (like jQuery)?

谢谢。

推荐答案

斜体字不适用于chrome和opera。 plz检查 http://www.electrictoolbox.com/style-select-optgroup- options-css /

italic is not apply in chrome and opera. plz check http://www.electrictoolbox.com/style-select-optgroup-options-css/

我们可以为选项提供任何设计。

we can give any design for options.

<option style='font-style: italic; font-weight:bold;' selected="selected" value="#">
   <span>Choose One</span></option>
   <optgroup label="Option group 1">
<option value="TestValue">    TestValue</option>
<option value="TestValue">    TestValue</option>
<option value="TestValue">    TestValue</option>
</optgroup>
</select>

css：

 select option {
        background: none repeat scroll 0 0 #E5E3E3;
        border: 1px dotted #CCCCCC;
        height: 15px;
        line-height: 15px;
        text-indent: 3px;
        text-transform: capitalize;
        z-index: -9999; 
    }
    optgroup { /* Change font style and text alignment */
    font-style:italic;
    text-align:right;
    }

这篇关于列表框样式在特定项目（选项）HTML的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！