How to create a preview drop-down list of fonts?

Question

I would like to create a drop-down list to select a font. In this list, I would like each font parameter to be displayed in this style as a font preview.

<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> 

Above is a basic drop-down list in which each type of font has its own class name, but it may not seem like it works so that each class name has its own font that will be displayed in the drop-down list.

Thanks for any time taken to help find a solution.

Regards Tim

Answer 1

try the format as shown below.

 <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>