选择在Firefox中被视为链接的菜单选项

Question

我有一个普通的html选择菜单。 Firefox将选项视为链接，但IE不支持。这意味着我改变悬停链接的CSS代码会搞乱Firefox中的选择菜单。我怎么能阻止这个？

简化的选择菜单是：

<Select name='country' onchange='this.form.submit()'>
<option selected value='1'>USA</option>
<option value='2'>UK</option>
</Select>

CSS简化为：

#rightnavigation {
font: 12pt Arial,geneva,sans-serif;
}
#rightnavigation :link {color: green; font: 10pt Arial,geneva,sans-serif;}
#rightnavigation :visited {color: red; font: 10pt Arial,geneva,sans-serif;}
#rightnavigation :hover {color: orange; font: 10pt Arial,geneva,sans-serif;}

当我将鼠标移动到菜单上时，所有选项都会调整为字体10并在Firefox中变为橙色，而不是像IE一样保持黑色。

我尝试创建一个类并将其应用于每个选项，但这仅适用于未选择的选项。

Answer 1

只需将选择器更改为仅影响链接：

#rightnavigation a:link {color: green; font: 10pt Arial,geneva,sans-serif;}
#rightnavigation a:visited {color: red; font: 10pt Arial,geneva,sans-serif;}
#rightnavigation a:hover {color: orange; font: 10pt Arial,geneva,sans-serif;}