【100分】关于css优先级的问题，请高手大大们出谋划策！！！！！

[丰云]

今天在项目中遇到一个css问题，描述如下：
页面有个内容为font-weight的各选项值的下拉框列表，如图：
它的源码：

<select id="ue_richbox_weight" style="width:80px;height:20px;margin:0 2px;" onchange="UEditor.menu_click(this,'style',{fontFamily: this.value});"><option value="Lighter" style="font-weight:lighter">Lighter</option><option value="100" style="font-weight:100">100</option><option value="200" style="font-weight:200">200</option><option value="300" style="font-weight:300">300</option><option value="400(nomal)" style="font-weight:400">400(nomal)</option><option value="500" style="font-weight:500">500</option><option value="600" style="font-weight:600">600</option><option value="700(bold)" style="font-weight:700">700(bold)</option><option value="800" style="font-weight:800">800</option><option value="900" style="font-weight:900">900</option><option value="Bolder" style="font-weight:lighter">Bolder</option></select>

我要实现的效果是，下拉框的文字样式跟它的文字相对应，这样用户选择的时候就很直观。
但实际的情况是，在ie里显示跟预期的一样，但在chrome和firefox里完全失效。
而网查了很多资料，没有哪里说这个样式有兼容问题，
并且产生的原因也找到了：
就是浏览器默认样式优先级高于我的内嵌样式。。。。。。这完全说不过去啊！！！！！！！！
因为所有的资料都说内嵌样式优先级最高！！
并且，我加上!important也没用，这真是太神奇了！！！！！

请高手们帮我想想办法吧，实在是太郁闷了！！！

[u011151921]

用这个吧！

<select>
  <optgroup label="123123" style="font-weight:bold">123123</optgroup>
  <option value="Lighter" style="font-weight:lighter">
    Lighter
  </option>
</select>

[丰云]

引用 1 楼 u011151921 的回复:

用这个吧！

<select>
  <optgroup label="123123" style="font-weight:bold">123123</optgroup>
  <option value="Lighter" style="font-weight:lighter">
    Lighter
  </option>
</select>

都试过了，无效

[lansecheng]

那就不要用select标签了

[丰云]

引用 3 楼 lansecheng 的回复:

那就不要用select标签了

要回避这个问题有很多方法，现在是想要解决这个问题， 我就是不服气，font-weight是通用标签样式，css的优先级也是大家都认可且通用的，font-family,font-size等也都可以，为什么唯独这个font-weight不行，是不是别的什么问题干扰了而我们不知道的

[天际的海浪]

这不是优先级的问题，是浏览器根本不支持某元素设置某些样式。 你别的元素做个模拟的下拉框好了

[丰云]

引用 5 楼 jslang 的回复:

这不是优先级的问题，是浏览器根本不支持某元素设置某些样式。 你别的元素做个模拟的下拉框好了

你说的不对，仔细看看题目，浏览器是支持这个样式的，只是我的样式被覆盖了

[天际的海浪]

引用 6 楼 foren_whb 的回复:

[quote=引用 5 楼 jslang 的回复:] 这不是优先级的问题，是浏览器根本不支持某元素设置某些样式。 你别的元素做个模拟的下拉框好了

你说的不对，仔细看看题目，浏览器是支持这个样式的，只是我的样式被覆盖了[/quote] 我是说某些元素的某些样式是固定的，不支持用户的修改。这与css优先级没关系

[道先生]

别纠结了。。。 最开始浏览器出于安全考虑不允许对表单控件的某些样式修改，避免网页欺骗用户诱导用户做出错误的行为。 option 是内部属性，是不能直接修改的，有些样式可以通过父元素select修改，有些得有JS才行。 你想修改option样式，可以通过模拟或者JS等其他方法修改。

[道先生]

你非要内嵌style=""这个东西，除非你去让人家重新定义标准。。。。

[丰云]

引用 9 楼 wdzmds 的回复:

你非要内嵌style=""这个东西，除非你去让人家重新定义标准。。。。

那你怎么解释，同一个页面同一个浏览器，我有三个下拉框，一个是font-size,一个是font-family，他们都是好的，就这个font-weight不行？？？？

[道先生]

恩恩 我也试过了 偏偏就是这个不行，，这也没办法，人家浏览器就是这么规定的。

[丰云]

算了，结帖了，现在看来，多半是w3c标准执行中的一个bug吧，不知道会不会被修复。