遇到的场景：

有一个输入框 设置 outline:none 然后我又想给他设置获取焦点的颜色

然后 我给input 设置 border 为 1px t透明的 然后 获取焦点的时候 重新设置border 为 1px 加一个色值

然后在IOS手机上的效果

解决办法： 在input 标签上添加-webkit-appearance：none 这个属性

去除系统默认appearance的样式,常用于IOS下移除原生样式

详细解读该属性链接如下

input输入框在ios手机上获取焦点后有一个灰色阴影的更多相关文章

  1. 利用exif.js解决ios手机上传竖拍照片旋转90度问题

    html5+canvas进行移动端手机照片上传时,发现ios手机上传竖拍照片会逆时针旋转90度,横拍照片无此问题:Android手机没这个问题. 因此解决这个问题的思路是:获取到照片拍摄的方向角,对非 ...

  2. 解决ios手机上传竖拍照片旋转90度问题

    html5+canvas进行移动端手机照片上传时,发现ios手机上传竖拍照片会逆时针旋转90度,横拍照片无此问题:Android手机没这个问题. 因此解决这个问题的思路是:获取到照片拍摄的方向角,对非 ...

  3. https加载http资源，导致ios手机上的浏览器图片加载问题

    今天解决一个线上bug的时候发现的问题,如下图: 从表象来看,同样的图片,安卓手机上可以正常展示,但是到ios手机上首次进入页面就不能正常显示图片,必须手动刷新一次页面才能正常加载. 这时候,我们首先 ...

  4. 如何在iOS手机上进行自动化测试

    版权声明:允许转载,但转载必须保留原链接:请勿用作商业或者非法用途 Airtest支持iOS自动化测试,在Mac上为iOS手机部署iOS-Tagent之后,就可以使用AirtestIDE连接设备,像连 ...

  5. 关于ios手机上拉和下拉到底部和顶部的橡皮筋问题

    之前遇到一个问题,就是写了一个正常的移动端首页,底部是导航,上面的是内容,在安卓手机是页面滑动到底部的时候,不会再滑动的,但是问题就出现在ios手机中.页面正常布局是,导航是position:fixe ...

  6. 解决input输入框在iOS中有阴影问题

    input{ -webkit-appearance: none; }

  7. 安卓手机和ios手机上图片未设置宽度可能导致ios上图片贼小

    处理方法: 设置固定宽度,高度自适应

  8. input输入框修改后自动跳到最后一个字符

    <input class="m-form-control" onpaste="return false" placeholder="直播间名称& ...

  9. h5 ios手机 隐藏input输入光标

    前面在做一个H5中用到的6位数字密码弹框(类似支付.微信那种)时,遇到一个可怕问题,那就是在浏览器和安卓中是不显示输入光标的,但是在ios手机上光标总是能看见,像穿透一样地显示最外层. 先说下实现密码 ...

随机推荐

  1. 动手实现一个同步器（AQS）

    在多线程情景下,如果不会某一共享变量采取一些同步机制,很可能发生数据不安全现象,比如购买车票时,当多个人购买时,不加锁就会产生多人买同一张票的现象,显然这是不可取的.所以要有一种同步机制,在某一时刻只 ...

  2. Android显示单元--像素、分辨率、颜色

    1.像素 老子曾说“天下难事必作于易,天下大事必作于细”,Android开发也是一样,再复杂的App也无非就是数百万个像素点的排列组合.像素虽然看似简单,但是里面大有学问.如果在开发时对像素单位不以为 ...

  3. 使用IntersectionObserver制作滚动动画以及其他记录

    前言 最近在重做公司项目的主页,正好新来了个UI,整个都重新设计了一下,动画还挺多的.我之前没有怎么玩过这些,踩了挺多坑,最后找到了目前而言最合适的方法,现在做一个记录. 需要把原来的主页从项目中抽出 ...

  4. Give me five !

    @media only screen and (max-width: 360px) { #friedsGroup { grid-template-columns:1fr!important; } } ...

  5. js监听textarea 内容的变化，并计算内容的长度c

    html代码如下:   <div class="customer-message">   <label for="customerMessage&quo ...

  6. java下的slf4j

    一.导读 我们使用log4j框架时,经常会用slf4j-api.在运行时,经常会遇到如下的错误提示: ? 1 2 3 4 5 SLF4J: Class path contains multiple S ...

  7. 学习Python常用的工具

    Python编程语言 Python是一门高级计算机程序设计语言! Python是一种解释型(脚本)语言,因为其代码简明,书写效率高,功能强大.易扩展.有丰富的专业库而受大众欢迎! 最常用的专业库有: ...

  8. 题解【AcWing95】费解的开关

    题面 一道非常好的递推练习题. 我们考虑每次枚举第一行的操作,由上一行的状态递推出下一行的状态,最后判断最后一行是否全部为 \(1\) 即可. 实现代码时要注意一些细节问题. #include < ...

  9. 4.Docker 操作容器

    启动容器 所需要的命令主要为 docker run.例如,下面的命令输出一个 “Hello World”,之后终止容器. docker run ubuntu:16.04 /bin/echo 'Hell ...

  10. C++——指针5

    8.2 指向类的静态成员的指针 对类的静态成员的访问不依赖于对象,可以用普通的指针来指向和访问. //通过指针访问类的静态数据成员 #include <iostream> using na ...