如何使用预览创建选择字体下拉列表?

时间:2013-03-29 00:16:41

标签: html css

我想创建一个选择下拉列表,以便能够选择字体。在此列表中,我希望每种字体选项都以该样式显示为字体预览。

<select>
    <option class="Times-New-Roman" value="Times-New-Roman">Times New Roman</option>
    <option class="Verdana" value="Verdana">Verdana</option>
    <option value="Comic-Sans-MS">Comic Sans MS</option>
    <option value="WildWest">WildWest</option>
    <option value="Bedrock">Bedrock</option>
</select>

上面是一个基本的下拉框,其中每个字体类型都有自己的类名,但似乎无法弄清楚如何制作它,以便每个类名都有自己的字体,将显示在下拉列表中。

感谢您花时间帮助找到解决方案。

最诚挚的问候, 添

1 个答案:

答案 0 :(得分:3)

尝试下面的格式。

<select>
    <option style="font-family:'Times New Roman';" class="Times-New-Roman" value="Times-New-Roman">Times New Roman</option>
    <option style="font-family:Verdana, Geneva, sans-serif;" class="Verdana" value="Verdana">Verdana</option>