如何改变下拉的列表项的字体家庭？如何改变下拉的列表项的字体家庭？(How to change fon

我有一个下拉列表，列出字体系列。像宋体，宋体，宋体，等我想按照它所代表的值来改变每个下拉项的字体家庭。就像Photoshop中做的。

我改变了CSS每个下拉项，但它只能在Firefox浏览器。它不会对任何其他浏览器。

我不希望使用任何的jQuery插件。

Answer 1:

这是因为select的元素孩子（ option S）是不是真的风格化和Firefox似乎忽略了规范的一部分唯一的浏览器。

解决方法是更换您的select与使用仅风格化的元素，也许对于交互一些JavaScript自定义窗口小部件的元素。喜欢怎么在这里做： ~~http://jsfiddle.net/sidonaldson/jL7uU/~~或http://jsfiddle.net/theredhead/4PQzp/

Answer 2:

你可以做这样的事情

<select>
<optgroup style="font-family:arial">
    <option>Arial</option>
</optgroup>
<optgroup style="font-family:verdana">
    <option>veranda</option>
</optgroup>

Answer 3:

您可以通过以下方式的HTML下拉列表中设置字体：
1.建立你的将被显示在下拉选项列表，但不要任何造型/类适用于任何的这些选项。在PHP中我会存储我的选择，一个变量列表，然后使用该变量选项添加到我的下拉我将在下面显示。
2.当你想实际插入下拉到页面，使用SELECT标签，并将该标签里面的一些CSS样式，因为我已经如下图所示：

<SELECT style='font-size: 10px; font-family: "Verdana", Sans-Serif;' name='???????'>
<?php echo $your_variable_containing_dropdown_content; ?>
</SELECT>

该工程100％的罚款，我的网站，我目前的工作。这仅仅是我在我的页面中使用的样式，但它可以是任何你需要它。

Answer 4:

你可以在CSS做的就是你所描述的：设置font-family上option元素，这限制了浏览器的支持。浏览器可以实现select使用部分或完全免疫CSS程序元素。

解决方法是使用一种比别的select元素，比如一组单选按钮，但它当然可以从下拉菜单中选择不同的渲染。然后你可以使用如

<div><input type="radio" name="font" value="Tahoma" id="tahoma">
<label for="tahoma" style="font-family: Tahoma">Tahoma</label></div>
...

Answer 5:

这应该给你一个想法，以浩来实现：

<select>

    <option value="Arial">First</option>
    <option value="Verdana">Second</option>


    </select>




    $(function() {
    $('select > option').hover(function() {
        $(this).parent().css({fontFamily:$(this).val()})    
})            
})

的jsfiddle

Answer 6:

试试这个：

<html>
  <head>
    <style>
.styled-select {
        overflow: hidden;
        height: 30px;
}
.styled-select select {
        font-size: 14pt;
        font-family:"Times New Roman",Times,serif;
        height: 10px;
}
</style>
    <title></title>
  </head>
  <body>
    <div class="styled-select">
      <select>
        <option selected="selected" >One</option>
        <option >Two</option>
      </select>
    </div>
  </body>
</html>

文章来源: How to change font-family of drop down's list item?