js获取媒体查询屏幕的属于哪种屏幕

Posted 老程

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了js获取媒体查询屏幕的属于哪种屏幕相关的知识,希望对你有一定的参考价值。

/**
 * 获取屏幕的属于哪种屏幕
 * @returns {string} xs为超小屏  sm为小屏  md为中屏  lg 为大屏
 */

export let getScreen =  function () {
    if(win.matchMedia("(min-width: 1200px)").matches) {
        return \'lg\';
    }else if(win.matchMedia("(min-width: 992px)").matches) { // screen and (min-width: 992px)
        return \'md\'
    }else if(win.matchMedia("(min-width: 768px)").matches) { // screen and (min-width: 768px)
        return \'sm\'
    }else {
        return \'xs\' // 超小屏幕
    }
}
地址:链接地址

以上是关于js获取媒体查询屏幕的属于哪种屏幕的主要内容,如果未能解决你的问题,请参考以下文章

IE兼容

Web移动前端开发-——rem+less+媒体查询,rem+flexble.js+媒体查询

CSS媒体查询(媒体屏幕)[关闭]

使用媒体查询按屏幕大小调整文本大小

当我将屏幕调整为小于 600 像素时,媒体查询不起作用

根据屏幕大小/媒体查询更改 Bootstrap 列类属性