前端ios和安卓的兼容性问题

时间:2020-9-17 作者:admin

  1. 日期兼容性
  • 安卓系统下
    Date.parse(new Date(‘2018-03-30 12:00:00’))
    会直接转换成时间戳的形式(简单说就是整数形式)

  • ios系统下
    Date.parse(new Date(‘2018-03-30 12:00:00’))
    sorry,转换不了

解决办法:

Date.parse(new Date(‘2018/03/30 12:00:00’))

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

解决办法:

input:focus{outline:none}  //去除外边框
input:{-webkit-appearance: none;}
  1. ios系统,会将数字当成电话号码,导致变色

解决办法:

<meta name="format-detection" content="telephone=no"> 
<meta http-equiv="x-rim-auto-match" content="none">
  1. input 的placeholder属性会使文本位置偏上

解决办法:

line-height: (和input框的高度一样高)//pc端解决方法
line-height:normal //移动端解决方法
  1. input type=number之后,pc端出现上下箭头

解决办法:

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
-webkit-appearance: none !important;
	 margin: 0;
 }
  1. 禁止安卓识别email

解决办法:

<meta content="email=no" name="format-detection" />
  1. ios 设置input 按钮样式会被默认样式覆盖

解决办法:

input,textarea {
	 border: 0;
  -webkit-appearance: none; }

以上是一些常遇到的兼容问题,希望对你有所帮助

声明:本文内容由互联网用户自发贡献自行上传,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任。如果您发现有涉嫌版权的内容,欢迎进行举报,并提供相关证据,工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。