媒体查询，常用设备尺寸

说明：仅供学习和参考使用，转载请注明出处。

/*大型屏幕pc 超大屏*/
        @media screen and (min-width:1200px){
            #content {
                color: #f00;
                background: #000;
            }
        }
        /*1200>=pc>=992 大屏，字体红色，背景黑色*/
        @media screen and (min-width:992px) and (max-width: 1199px){
            #content {
                color: #f00;
                background: #000;
            }
        }
        /*768<=pad<992 中屏，字体黄色，背景红色*/
        @media screen and (min-width: 768px) and (max-width: 991px) {
            #content {
                color: #ff0;
                background: #f00;
            }
        }
        /*phone<768  小屏，字体黑色，背景蓝色*/
        @media screen and (max-width: 767px) and (min-width: 480px){
            #content {
                color: #000;
                background: #0ff;
            }
        }
        /* 超小屏，字体黑色，背景蓝色*/
        @media screen and (max-width: 480px){
            #content {
                color: #000;
                background: #0ff;
            }
        }