Question

我在表单中选择了如下选项，

<select>
<option class="hdng">Number</option>
<option>1</option>
<option>2</option>
<option>3</option>
<option class="hdng">Alphabets</option>
<option>a</option>
<option>b</option>
<option>c</option>
</select>

以我的风格我应用了样式标题，

.hdng
{
font-weight: bold;
padding-top: 10px;
}

以上样式仅在Firefox浏览器中应用。其余浏览器不支持该样式。对此有什么解决方法吗？

Answer 1

在Chrome 16中我也失败了，考虑使用往往具有更好造型支持的optgroup。在语义上对于你想要做的事情是正确的。

<select>
<optgroup label="Number">
   <option>1</option>
   <option>2</option>
   <option>3</option>
</optgroup>
<optgroup label="Alphabets">
   <option>a</option>
   <option>b</option>
   <option>c</option>
</optgroup>    
</select>

http://jsfiddle.net/sVKjv/1/

仅在Firefox浏览器中应用选择选项的样式？

1 个答案: