输入(type =数量)::-webkit-inner-spin-button, 输入(type =数量)::-webkit-outer-spin-button { -webkit-appearance:没有; <input id="test" type="number">

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}

源

Firefox 29目前增加了对数字元素的支持，所以这里有一个代码片段，用于隐藏webkit和基于moz的浏览器中的旋转器:

输入(type =“数量”){ -moz-appearance:文本框; ｝ 输入::-webkit-outer-spin-button, 输入:-webkit-inner-spin-button { -webkit-appearance:没有; ｝ <input id="test" type="number">

试着用input type="tel"代替。它弹出一个数字键盘，没有显示旋转框。它不需要JavaScript或CSS或插件或其他任何东西。

在WebKit和基于blink的浏览器和所有类型的浏览器中使用以下CSS:

/* Disable Number Arrow */
input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
  -webkit-appearance: none; 
  margin: 0; 
}

在Firefox for Ubuntu上，只是在使用

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

帮我搞定了。

添加

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
}

会让我

未知伪类或伪元素' -webkit-outer-spin-button '。 由于错误的选择器而忽略规则集。

每次我尝试。内部旋转按钮也是一样。