Firefox更新到29.0.1后也面临同样的问题，这也列在这里 https://bugzilla.mozilla.org/show_bug.cgi?id=947728

解决方案: 他们(Mozilla的家伙们)通过为<input type="number">引入"-moz-appearance"支持来解决这个问题。 你只需要有一个与输入字段相关联的样式"-moz-appearance:textfield;"。

我更喜欢CSS方式 例如:-

.input-mini{
-moz-appearance:textfield;}

Or

你也可以内联执行:

<input type="number" style="-moz-appearance: textfield">

在2021年，有一个更好的解决方案可以让你的firefox像谷歌Chrome一样。 你也应该使用焦点和悬停。

input[type="number"] {
    appearance: none; /* textfield also works! */
}

input[type="number"]:focus, 
input[type="number"]:hover {
    appearance: auto;
}

有关更多信息，请阅读文档

值得指出的是，在Firefox中，这些元素上的-moz-appearance的默认值是number-input。

如果你想在默认情况下隐藏微调器，你可以设置-moz-appearance: textfield，如果你想让微调器出现在:hover/:focus上，你可以用-moz-appearance: number-input覆盖之前的样式。

输入(type = "数量"]{ -moz-appearance:文本框; ｝ 输入(type = "数量"]:徘徊, 输入(type = "数量"]:专注{ -moz-appearance:输入数字; ｝ < input type = "数量" / >

我想有人可能会发现这很有帮助，因为我最近不得不这样做，试图提高Chrome/FF之间的一致性(因为这是Chrome默认情况下数字输入的行为方式)。

如果您想查看- mz -appearance的所有可用值，可以在这里找到它们(mdn)。

根据这篇博文，你需要设置-moz-appearance:textfield;在输入上。 输入(type =数量)::-webkit-outer-spin-button, 输入(type =数量)::-webkit-inner-spin-button { -webkit-appearance:没有; 保证金:0; ｝ 输入(type =数量){ -moz-appearance:文本框; ｝ <input type="number" step="0.01"/>

我从上面的答案和如何在Opera中删除输入[type="number"]中的箭头中混合了一些答案 scss:

input[type=number] {
  &,
  &::-webkit-inner-spin-button,
  &::-webkit-outer-spin-button {
    -webkit-appearance: none;
    -moz-appearance: textfield;
    appearance: none;

    &:hover,
    &:focus {
      -moz-appearance: number-input;
    }
  }
}

Tested on chrome, firefox, safari

Firefox更新到29.0.1后也面临同样的问题，这也列在这里 https://bugzilla.mozilla.org/show_bug.cgi?id=947728

解决方案: 他们(Mozilla的家伙们)通过为<input type="number">引入"-moz-appearance"支持来解决这个问题。 你只需要有一个与输入字段相关联的样式"-moz-appearance:textfield;"。

我更喜欢CSS方式 例如:-

.input-mini{
-moz-appearance:textfield;}

Or

你也可以内联执行:

<input type="number" style="-moz-appearance: textfield">