遇到的场景：

有一个输入框 设置 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. LNMP环境配置（1）

    安装Nginx.MySQL.PHP 概念 LNMP是Linux Nginx MySQL PHP 的简写,把Nginx.MySQL以及PHP安装在Linux系统上,组成一个环境来运行PHP的脚本语言. ...

  2. 【python语法基础-经典练习题】python语法基础练习题01---商场打折

    # 1.一家商场在降价促销.如果购买金额50-100元(包含50元和100元)之间,会给10%的折扣(打九折),# 如果购买金额大于100元会给20%折扣.编写一程序,询问购买价格,再显示出折扣(%1 ...

  3. 关于java静态存储类的一个知识点

    今天在写代码的时候产生了一个很奇怪的问题:静态类里的数据在其他类中更改之后,是否会保存 然后就动手试验了一下,结果是 ·在更改数据的类中,输出数据都是更够以后的数据 ·在先执行更改数据的类之后执行第二 ...

  4. window - 安装 tomcat

    一.下载安装包 参考网址:https://archive.apache.org/dist/tomcat 百度网盘:https://pan.baidu.com/s/1mtNuTUCFp-_SIHIp_R ...

  5. Flask之RESTFul API前后端分离

    Flask之RESTFul API前后端分离 一:虚拟环境搭建的两种方式 1 pipenv的使用 pip install --user pipenv安装pipenv在用户目录下 py -m site ...

  6. python 元组 列表 字典

    type()查看类型 //取整除 **幂 成员运算符: in  x在y序列中,就返回true 反之  not in 身份运算符: is is not 逻辑运算符 and or not 字符编码 问题 ...

  7. SE篇

    1. List 和 Set 区别       List 特点:元素有放入顺序,元素可重复     Set 特点:元素无放入顺序,元素不可重复,重复元素会覆盖掉   2. List 和 Map 区别   ...

  8. 最短路（Dijkstra，Floyd，Bellman_Ford，SPFA）

    当然,这篇文章是借鉴大佬的... 最短路算法大约来说就是有4种——Dijkstra,Floyd,Bellman_Ford,SPFA 接下来,就可以一一看一下... 1.Dijkstra(权值非负,适用 ...

  9. html5 流式布局 弹式布局 flex

      <!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8& ...

  10. 支持CSS3的高级CSS

    一.匹配部分字符串 在CSS2中,可以使用[ href='info.htm' ] 这样的属性选择器来匹配href属性中的字符,但是无法只匹配部分字符串.而CSS3给出了三个新的运算符:^ , $ 和 ...