前端面试 - 兼容性

1、1px像素边框问题(利用伪元素模拟一个1px边框，再缩放为原来的0.5)
<div class="box"></div>
.box {
   position: realative
}
,box::after {
content: '",
height: 1px,
width: 100%,
position: absolute,
left: 0,
bottom: 0,
transform: scaleY(0.5),
transform-origin: top
}
2、overflow: scroll/auto再ios上滑动卡顿问题
-webkit-overflow-scrolling: touch
3、移动端12px字体大小显示异常
先整体放大一倍再用transform中的scale进行缩小
4、ios上识别长串数字为电话
meta标签上写入content="telephone=no"
5、禁用ios、安卓用户选中文字   -webkit-user-select: none
6、ios中在input输入英文时首字母默认会大写 <input autocorrect="off"  autocapitalize="off">
7、在ios中给input框设置disabled: true禁用时出现异常： 选中input设置opcity: 1
8、安卓机上给placeholder设置行高时文字会偏上，不要在安卓机上给placeholder文字设置行高