兼容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-width: 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的聚焦边框:
- input,button,select,textarea{outline:none}
- 取消chrome下textarea可拖动放大:
- textarea{resize:none}
- 最后,写在一起,重置input和textarea的默认样式:
- input,button,select,textarea{outline:none}
- textarea{resize:none}
- input,textarea{
- -webkit-appearance: none;
- }
- Safari 中 input textarea 去除阴影
纯数字键盘 <input type="text" pattern="[0-9]*">