我可以在网页上的选择列表中使用等宽字体吗?

时间:2012-02-23 17:43:05

标签: html jquery-ui jquery-ui-tabs monospace

我希望我的网页上的选择列表中的条目以等宽字体显示。我尝试编写以下HTML。

<p style='font-family:"Andale Mono", "Monotype.com", monospace;'>

    The quick brown fox jumped over the lazy dogs.

    <select multiple="multiple">
      <option value='1'>Option 1</option>
      <option value='2'>Option 2</option>
    </select>
</p>

结果是“The quick ...”看起来是等宽的,但选项不是。是 是否可以使选项以等宽字体显示?

更新:我发现这个问题似乎源于我的select元素在jQuery-UI标签div中。

2 个答案:

答案 0 :(得分:2)

你的CSS中有什么问题?

option {
  font-family: "Andale Mono", "Monotype.com", monospace;
}

答案 1 :(得分:2)

select {
  font-family: "Andale Mono", "Monotype.com", monospace;
}​

示例:http://jsfiddle.net/LkJfp/

我不认为你可以在IE7中这样做:http://www.456bereastreet.com/lab/styling-form-controls-revisited/select-single-optgroup/#ie7-xp