2.input框聚焦,ios出现outline或者阴影,安卓显示正常

  • 解决方法
input:focus{outline:none}
input:{-webkit-appearance: none;}

3.关于flex布局

  • 解决方法

    flex布局对于低版本的安卓,不支持flex-wrap:wrap属性,但是ios系统支持换行属性,这个时候如何解决呢?当然是不使用换行啦。

    如果你的布局必须要用到换行,那就在外层包裹一个大的div,然后设置几个小div,每个小div的布局都是flex(但是不换行哦);(希望你能理解我的意思,如果不理解,可以在下方留言,我会实时做出解答)

4.ios系统,会将数字当成电话号码,导致变色

  • 解决方法
<meta name="format-detection" content="telephone=no">
<meta http-equiv="x-rim-auto-match" content="none">

将上面的代码加入到<head>标签中

5.禁止安卓识别email

  • 解决方法
<meta content="email=no" name="format-detection" />

6.input 的placeholder属性会使文本位置偏上

  • 解决方法
line-height: (和input框的高度一样高)---pc端解决方法
line-height:normal ---移动端解决方法

7.input type=number之后,pc端出现上下箭头

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

作者:一个写前端的姑娘

ios、安卓前端兼容性1的更多相关文章

  1. ios、安卓前端兼容性

    1.日期兼容性 解决方法(请看我上一篇文章)安卓.ios时间转换成时间戳的形式 2.input框聚焦,ios出现outline或者阴影,安卓显示正常 解决方法 input:focus{outline: ...

  2. Web前端兼容性指南

    一.Web前端兼容性问题 一直以来,Web前端领域最大的问题就是兼容性问题,没有之一. 前端兼容性问题分三类: 浏览器兼容性 屏幕分辨率兼容性 跨平台兼容性 1.浏览器兼容性问题 第一次浏览器大战发生 ...

  3. H5和PC实现点击复制当前文字的功能,兼容ios,安卓

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

  4. WPF C#仿ios 安卓 红点消息提示

    原文:WPF C#仿ios 安卓 红点消息提示 先把效果贴出来,大家看看. 代码下载地址: http://download.csdn.net/detail/candyvoice/9730751 点击+ ...

  5. 让微信内置浏览器兼容clipboard.js 复制粘贴 ios 安卓

    <!--js copy事件--><script type="text/javascript" src="/static/js/clipboard.min ...

  6. 【原】移动web资源整理(安卓、ios移动端兼容性问题归整)

     meta基础知识 H5页面窗口自动调整到设备宽度,并禁止用户缩放页面 <meta name="viewport" content="width=device-wi ...

  7. ios、安卓的兼容性

    日期转换成时间戳: 安卓下可以使用 Date.parse(new Date('2019-11-18 12:00:00')) 直接转换,结果为 1574049600000 ios下 Date.parse ...

  8. 移动前端兼容性笔记 - 安卓2.x 自带原生浏览器箭头问题

    这样的箭头用CSS-3实现,整段代码如下: <!DOCTYPE html> <html lang="en"> <head> <meta c ...

  9. 使用axios对安卓或者ios低版本兼容性处理

    原因:不支持ES6,无法使用promise 解决办法: 1.安装 es6-promise cnpm install es6-promise --save-dev 2.引入 es6-promise im ...

随机推荐

  1. 自定义常用input表单元素三:纯css实现自定义Switch开关按钮

    自定义常用input表单元素的第三篇,自定义一个Switch开关,表面上看是和input没关系,其实这里采用的是checkbox的checked值的切换.同样,采用css伪类和"+" ...

  2. 《我想进大厂》之Dubbo普普通通9问

    这是面试专题系列第四篇,Dubbo系列.Dubbo本身并不复杂,而且官方文档写的非常清楚详细,面试中dubbo的问题一般不会很多,从分层到工作原理.负载均衡策略.容错机制.SPI机制基本就差不多了,最 ...

  3. Ⅱ Finite Markov Decision Processes

    Dictum:  Is the true wisdom fortitude ambition. -- Napoleon 马尔可夫决策过程(Markov Decision Processes, MDPs ...

  4. jacoco-1-java代码测试覆盖率之本地环境初体验

    前言 jacoco是一个开源的覆盖率工具,它针对的开发语言是java,其使用方法很灵活,可以插桩到Ant.Maven中,可以使用其JavaAgent技术监控Java程序等. 那么本次主要使用对java ...

  5. drf (学习第三部)

    目录 视图 视图额基类 视图类扩展 GenericAPIView的视图子类 视图集ViewSet 路由Routers 视图 Django REST framework 提供的视图的主要作用: 控制序列 ...

  6. vue 组件传值,(太久不用就会忘记,留在博客里,方便自己查看)

    一 :父组件 传值给 子组件 方法: props //父组件 <template lang="html"> <div> <h3>我是父亲< ...

  7. 通过Relect反射方法创建对象,获得对象的方法,输出对象信息

    package reflects; import java.lang.reflect.Constructor; import java.lang.reflect.Field; import java. ...

  8. 线上问题排查,一不小心踩到阿里的 arthas坑了

    最近帮新来的校招同学排查一个线上问题,问题本身不是很难,但是过程中踩到了一个arthas的坑,挺有意思的. 同时,也分享下在排查过程中使用的一些比较实用的工具,包括tcpdump.arthas.sim ...

  9. Django中间件(Middleware)处理请求

    关注公众号"轻松学编程"了解更多. 1.面向切面编程 切点(钩子) 切点允许我们动态的在原有逻辑中插入一部分代码 在不修改原有代码的情况下,动态注入一部分代码 默认情况,不中断传播 ...

  10. PageHelper使用步骤

    一.导入jar包(maven构建导入坐标) <dependency> <groupId>com.github.pagehelper</groupId> <ar ...