李维亮_前端开发攻城狮 - input
type: channel
link: https://www.liweiliang.com/tag/input/
items: 移除HTML5 input在type="number"时的上下小箭头

移除HTML5 input在type="number"时的上下小箭头
type: item
date: 2017-08-02T18:18:00+08:00
description: 在chrome下：input[type="number"]::-webkit-outer-spin-button, input[type="number"]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } 在Firefox下：input[type="number"] { -moz-appearance: textfield; }如果感觉还不放心，吧下面的这段加上input[type="number"]:hover, input[type="number"]:focus { -moz-appearance: number-input; } 第二种方案：将type="number"改为type="tel"，同样是数字键盘，但是没有箭头，但是这样会有一个问题无法设置input的 max和min 值了，当还有step，当然如果你想用这种方案的话可以利用input的 pattern 属性来正则加验证。