输入类型箭头旋转按钮非标准答案

【问题标题】：input type arrow spin-button non-standard输入类型箭头旋转按钮非标准
【发布时间】：2018-01-24 11:16:24
【问题描述】：

我正在查看MDN for spinners（输入箭头type="number"），它说它是非标准的。我记得的方式是 MDN 也告诉你使用什么，但在这种情况下，它不是。我的问题是，当我使用

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

它适用于 chrome，但不适用于 Firefox。所以我猜测由于非标准它不适用，它的“标准”解决方法是什么？

【问题讨论】：

-moz- -webkit- 选择器中的供应商前缀！！我猜这是无效的
也许这会有所帮助：stackoverflow.com/questions/43777047/…
Hide Spinner in Input Number - Firefox 29的可能重复

标签： html css

【解决方案1】：

input[type=number]::-webkit-inner-spin-button 当浏览器为webkit 时，这将用作选择器，否则不会应用此选择器中的任何样式。

input[type=number] {
  -moz-appearance: textfield;
  margin: 0;
}

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

&lt;input type="number"&gt;

【讨论】：