选择具有不同字体系列的列表选项 - 如何执行此操作?

时间:2011-10-18 15:19:07

标签: javascript jquery css selectlist

显然无法为个人<option>标记提供不同的font-family值。我想以某种方式实现这种效果。我已经尝试过jQuery selectbox插件,但这似乎不允许我为各个选项设置样式。有人可以提出解决方案吗?

由于

4 个答案:

答案 0 :(得分:0)

此插件将选择框更改为ul li树,因此您可以在li上设置font-family

http://www.devirtuoso.com/2009/08/styling-drop-down-boxes-with-jquery/

答案 1 :(得分:0)

也许完整的DIY解决方案?单击元素时,显示带有一些自定义样式<li>项的标记。

答案 2 :(得分:0)

标准HTML <select><option>...</option></select>不允许您更改选项之间的字体。这根本不可能。

您正在使用的jQuery Selectbox插件以标准HTML <select>开始并重新分配它。

理论上,由于重新设计,因此可以更改字体,但似乎此插件在此区域内限制为标准功能(可能使其为后退用户提供更流畅的体验)到标准HTML);它似乎不支持更改字体。

您可能需要考虑替代插件。有大量的jQuery插件可供选择处理选择框功能,因此您应该能够找到一个适合您需求的插件。例如,This one似乎支持修改字体,但也有很多其他字体。

希望有所帮助。

答案 3 :(得分:0)

这不是100%完美,但这个小提琴会让你90%的方式:

http://jsfiddle.net/Y39HQ/

从下拉列表中选择一个不同的项目然后再切换回来,您将看到所选项目的字体更改。

基本上没有,你不能用默认的<select>做到这一点,但是JavaScript和selectBox这样的插件并没有那么难。

此外,可以使用css伪选择器nth-child()设置列表中的各个项目的样式。这将允许您设置列表中的每个项目的样式。当然,如果您在下拉菜单中手动构建项目,那么在列表项的创建点设置字体会更加清晰....

祝你好运!