Firefox下拉选项字体大小未呈现

Question

我需要增加<option>列表<select>的字体。虽然这在Chrome中很容易使用，但在Firefox中，唯一增加的是选定的选项。我的Firefox版本是50.1.0

参考this fiddle，我得到以下不同的结果：

火狐：

铬：

＆＃13;

＆＃13;

select {
  font-size: 200%;
}

＆＃13;

<select>
    <option value="1">One</option>
    <option value="2">Two</option>
</select>

＆＃13;

＆＃13;

＆＃13;

我希望在Firefox中也能获得与Chrome相同的行为。

Answer 1

这是Firefox中的一个错误，但仍未修复。

他们说已经解决，但问题仍然存在。

禁用多进程，它可以正常工作。

  

如何禁用多进程:(来自https://msdn.microsoft.com/en-us/library/system.globalization.textinfo.totitlecase(v=vs.110).aspx）：

     

转到about：config。搜索＆＃34; browser.tabs.remote.autostart＆＃34;。可能有多个结果。将它们全部设置为false并重新启动浏览器。

Bug Link：

LINK

Answer 2

在做了一些窥探后，我发现有些人在较新版本的Firefox中报告了这个问题。我自己使用开发版本，我遇到了和你一样的问题。

Mozilla的这些人article在这方面非常有趣。

有关于多个浏览器/设备上的选择框样式的部分，但您的选项看起来很薄。

通常像-moz-appearance: none这样的CSS属性可以提供帮助，但在这种情况下我无法查看解决方法，我已经看到有关这是新版Firefox中的错误的报告，因此手指越过它很快就会消失。祝你好运！

Answer 3

<强>更新

我忽略了完全解释我疯狂背后的方法，仅仅是因为我不能100％确定我的解决方案能够正常工作，因为在满月的某些Mac上发生了一些鲜为人知的错误（你可以告诉我使用它） PC和我嫉妒Mac的图形。）

以为你有一台Mac，我的坏。无论如何，解决方案都有效。

当处理字体和继承时，我们可以自然地假设，如果我们有一个body {font-size:16px;}继承将级联到其余的元素，就像一个16px的舒适毯子到一切。表单元素被忽略，默认情况下默认不继承字体属性。我们可以通过以下方式解决这个问题：

• 使用{1}}值，如修复1或...
• ...继承自修复2中的父级或...
• ...就像在修复3中一样。

此代码段有3个修复程序，其中一个可能适合您。

<强>段

inherit

html,
body {
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  font: 600 16px/1 Verdana;
}
* {
  margin: 0;
  padding: 0;
  line-height: 1;
}
fieldset {
  padding: 10px;
  margin: 50px auto;
}
legend {
  text-align: right;
}
select {
  width: 6ex;
}
/* Fix #1
|~~~~~~~~*/

select#X {
  font-size: 2em;
}
select#X > option {
  font-size: inherit;
}
/* Fix #2
|~~~~~~~~*/

select#Y {
  font-size: 200%;
}
select#Y > option {
  font-size: 100%;
}
/* Fix #3
|~~~~~~~~*/

select#Z {
  font-size: 32px;
}
select#Z > option {
  font-size: 32px;
}