input type='number' 去除小箭头

两种方法

方法一

For chrome, Safari, Edge, Opera :

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

For firefox :

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

方法二

<input type="text" inputmode="numeric" />

参考链接

https://www.geeksforgeeks.org/how-to-disable-arrows-from-number-input/

input type='number' 去除小箭头 clear arrow的更多相关文章

  1. input type = number 去除上下箭头,禁用滚轮事件(默认的自带滚轮加减数字)

    <style type="text/css"> /*盒子大小从边框开始计算*/ html * { box-sizing: border-box; } /*解决模态框抖动 ...

  2. input type=number去掉上下箭头

    <input type="number" ...> <style> input::-webkit-outer-spin-button, input::-we ...

  3. CSS input type="number"出现上下箭头时解决方案

    input type="number"时录入内容不可控制,解决方案是在css中添加//火狐input[type=number] {      -moz-appearance:tex ...

  4. 去除input[type=number]最右边的spinners(默认加减符号)

    // 去掉input[type=number]默认的加减号 input[type='number'] { -moz-appearance:textfield; } input[type=number] ...

  5. 去除input[type=number]的默认样式

    input[type=number] { -moz-appearance: textfield; } input[type=number]::-webkit-inner-spin-button, in ...

  6. 如何移除 input type="number" 时浏览器自带的上下箭头?

    Chrome 下 input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: no ...

  7. input type="number"时,maxlength不起作用怎么解决

    最近小颖在做公司的angular项目时,发现当input type="number"时,maxlength不起作用,百度了下解决方式,顺便记录下,以便后期查看嘻嘻 <inpu ...

  8. 兼容IE7、IE8、IE9的input type="number"插件

    IE11版本好像才兼容input type="number",但是现在Win7版本操作系统下,很多人的IE版本都是IE7/8/9,所以为了体验就自己写了一个小插件,支持设置最大值. ...

  9. 去掉 input type="number" 右边图标

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  10. input[type=number]问题

    有时候对于只能输入数字的表单会有想要写成input[type=number]但是其中有一个问题 <input type="text" name="code" ...

随机推荐

  1. Web初级——JavaScript

    JavaScript JavaScript是一种基于对象的脚本语言,用于开发基于客户端和基于服务器的Internet应用程序 1.了解JS 1.1JavaScript的组成 JavaScript 的核 ...

  2. 小项目中vuex使用频率不太多我们完全可以用provide inject 来代替可以让项目小不少

    在一般小型项目中vuex实在是太浪费了所以我们可以用到 vue中的provide inject 代替 1.在vue3中我们先另起一个 文件创建一个全局的状态和方法的地方(如果你的全局状态特别的多记得要 ...

  3. 对象的变为私有方法不可改动 seal freeze

  4. 继承QAbstractTableModel QStyledItemDelegate实现自定义表格,添加进度条和选中框。

    由于项目要求,需要实现一个列表目录显示信息,并且需要实现每一项提供进度条和选项框功能,所以需要继承QAbstractTableModel和QStyledItemDelegate进行自定义. -自定义数 ...

  5. android开发技巧杂谈

    android开发技巧一 android的一些常用包是发布在国外的,所以一些包,我们下载不下来,我们可以使用阿里云的镜像地址(maven { url 'https://maven.aliyun.com ...

  6. 用Java写一个分布式缓存——RESP服务端

    前言 本篇我们将完成一个RESP的socket的服务端,初步完成一个单机版缓存. 另外在其中我们还需要完成命令的动态路由 源码:https://github.com/weloe/Java-Distri ...

  7. 【读书笔记】JS函数式编程指南

    第一章 海鸥群可以合并和繁育 conjoin breed var result = flock_a.conjoin(flock_c).breed(flock_b).conjoin(flo ck_a.b ...

  8. 【已解决】rust 报错 no_std can't find crate for `test` || vscode 工作区多文件夹

    遇到下面的问题,请修改vscode的设置文件 如下 { "rust-analyzer.checkOnSave.allTargets": false, "rust-anal ...

  9. zookeeper06-watcher四字命令

    zookeeper四字监控命令​  zooKeeper支持某些特定的四字命令与其的交互.它们大多是查询命令,用来获取 zooKeeper服务的当前状态及相关信息.用户在客户端可以通过 telnet 或 ...

  10. mysql13 sql优化-explain

    1.Explain Explain可以对sql语句的执行性能进行分析.使用EXPLAIN关键字可以模拟优化器执行SQL查询语句,从而知道MySQL是如何处理你的SQL语句的.分析你的查询语句或是表结构 ...