iOS兼容问题

一、

input checkbox 复选框在pc 安卓都正常显示,但是在ios上有重影,黑框等显示问题,可以靠以下方法解决

    <style>
      input[type="checkbox"] {
        -webkit-appearance: none;
        -webkit-tap-highlight-color: transparent;
        background-color: transparent;
        border: none;
        outline: none;
      }
    </style>

radio等同理

二、

滚动条失效

解决一：

<style>
    .iframe {
        -webkit-overflow-scrolling: touch;  
        overflow-y: scroll;
    }
</style>

这个方法有点问题：在页面内具有多个overflow：auto的情况下，那些具有绝对定位（absolute, fixed） 属性的元素，也会跟着滚动。

解决二：

body {overflow-x: hidden}

即，给 body 元素添加overflow-x：hidden。然后在滚动容器内加overflow-y: auto