Getskel.com-Firefox mobile无法将模板识别为mobile

Getskel.com-Firefox mobile无法将模板识别为mobile,firefox,mobile,responsive-design,Firefox,Mobile,Responsive Design,我使用Getskel.com作为响应框架。除了android上的Firefox mobile,它在所有设备和浏览器上都能完美运行。使用ADP.exe调试它时,我发现该模板被识别为桌面而不是移动模板。这是我的skel.init: skel.init({ reset: 'full', breakpoints: { 'global': { range: '*', href: '/templates/responsivegs/css/style.css' },

我使用Getskel.com作为响应框架。除了android上的Firefox mobile,它在所有设备和浏览器上都能完美运行。使用ADP.exe调试它时,我发现该模板被识别为桌面而不是移动模板。这是我的skel.init:

    skel.init({
    reset: 'full',
    breakpoints: {
        'global': { range: '*', href: '/templates/responsivegs/css/style.css' },
        'desktop': { range: '737-', href: '/templates/responsivegs/css/style-desktop.css', containers: 1200, grid: { gutters: 25 } },
        '1000px': { range: '737-1200', href: '/templates/responsivegs/css/style-1000px.css', containers: 1000, grid: { gutters: 20 }, viewport: { width: 1080 } },
        'mobile': { range: '-736', href: '/templates/responsivegs/css/style-mobile.css', containers: '100%!', grid: { collapse: true, gutters: 20 }, viewport: { scalable: false } }
    },

有人遇到过同样的问题吗?

是的,我也遇到过同样的问题,我注意到在更新版本的skel.js中,媒体识别被更改为

        // Global.
            global: {
                href: 'css/style.css',
                containers: 1400,
                grid: {
                    gutters: ['2em', 0]
                }
            },

        // XLarge.
            xlarge: {
                media: '(max-width: 1680px)',
                href: 'css/style-xlarge.css',
                containers: 1200
            },

        // Large.
            large: {
                media: '(max-width: 1280px)',
                href: 'css/style-large.css',
                containers: 960,
                grid: {
                    gutters: ['1.5em', 0]
                },
                viewport: {
                    scalable: false
                }
            },

        // Medium.
            medium: {
                media: '(max-width: 980px)',
                href: 'css/style-medium.css',
                containers: '90%',
                grid: {
                    zoom: 2
                }
            },

        // Small.
            small: {
                media: '(max-width: 736px)',
                href: 'css/style-small.css',
                containers: '90%',
                grid: {
                    zoom: 3,
                    gutters: ['1.25em', 0]
                }
            },

        // XSmall.
            xsmall: {
                media: '(max-width: 480px)',
                href: 'css/style-xsmall.css',
                grid: {
                    zoom: 4
                }
            }

我找到了解决办法!我认为这是旧版本skel.js的一个bug

尝试更改:

'1000px': { range: '737-1200', href: '/templates/responsivegs/css/style-1000px.css', containers: 1000, grid: { gutters: 20 }, viewport: { width: 1080 } },
在:

'1000px':   { range: '(min-width: 737px) and (max-width: 1200px)', href: '/templates/responsivegs/css/style-1000px.css', containers: 1000, grid: { gutters: 20 }, viewport: { width: 1080 } },