移除HTML5 input在type="number"时的上下小箭头
在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 属性来正则加验证。
版权声明:本文为李维亮博主的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。
原文链接:http://www.liweiliang.com/811.html
评论已关闭