H5页面兼容

289 阅读1分钟

一、input上边框有阴影

解决方法:

input {
    outline: none;
    -webkit-appearance: none; /*去除系统默认的样式*/
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0); /* 点击高亮的颜色*/
}

二、input框提示字顶着上边框未居中

input::-webkit-input-placeholder {
    padding-top: 3px;
}

// 根据实际情况调整padding值

三、部分ios点击行类元素不生效

元素加上 cursor:pointer

四、移动端300ms延迟

window.addEventListener( "load", function() {
    FastClick.attach( document.body )
}, false )

五、移动端1px边框

.xxx:before{
      content:'';
      position: absolute;
      top: 0;
      left: 0;
      border: 1px solid #ccc;
      width: 200%;
      height: 200%;
      box-sizing:border-box;
      -webkit-box-sizing:border-box;
      -webkit-transform: scale(0.5);
      transform: scale(0.5);
      -webkit-transform-origin: left top;
      transform-origin: left top;
}

六、ios new Date(2020-05-05)兼容问题

new Date(2020/05/05)