移动响应适配问题

媒体查询

@media (max-width: 750px) and (min-width: 320px){
        .h5{display: block !important;}
        .pc{display: none !important;}
}

px转rem

    (function (win, doc) {
        if (!win.addEventListener) return;
        var html = document.documentElement;
        function setFont() {
            var cliWidth = html.clientWidth;
            if (cliWidth > 750) {
                cliWidth = 750;
            }
            html.style.fontSize = 100 * (cliWidth / 750) + 'px';
        }
        win.addEventListener('resize', setFont, false)
        doc.addEventListener('DOMContentLoaded', setFont, false)
    })(window, document);
 

防止手机放大缩小

    <meta name="viewport" content="width=device-width, initial-scale=1.0,maximum-scale=1.0,user-scalable=no">
    

title图标

     <link rel="icon" href="static/img/logo.png">
     

移动设备的判断

   navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i)