CSS媒体查询

兼容iphone4/4s

@media (device-height:480px) and (-webkit-min-device-pixel-ratio:2){

}

兼容iphone5

@media (device-height:568px) and (-webkit-min-device-pixel-ratio:2){

}

兼容iphone6，iphone7，iphone8s

@media (device-height:667px) and (-webkit-min-device-pixel-ratio:2){

}

兼容iphone6 Plus,iphone7 Plus,iphone8 Plus @media

(device-height:736px) and (-webkit-min-device-pixel-ratio:2){

}

兼容iphoneX

@media only screen and (device- 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3){

-webkit-text-size-adjust: 100%;-webkit-tap-highlight-color: rgba(0, 0, 0, 0);

1. 取消chrome下input和textarea的聚焦边框：

1. input,button,select,textarea{outline:none}
2. 取消chrome下textarea可拖动放大：
3. textarea{resize:none}
4. 最后，写在一起，重置input和textarea的默认样式：
5. input,button,select,textarea{outline:none}
6. textarea{resize:none}
7. input,textarea{
8. -webkit-appearance: none;
9. }
10. Safari 中 input textarea 去除阴影

纯数字键盘 <input type="text" pattern="[0-9]*">