媒介查询

媒体查询
/*
例子：min-width:600px,max-width:600px
具体含义，max-width:屏幕宽度小于600时做用（+,600））
min-width:屏幕宽度大于600时做用(600,+)
*/
下面就是屏幕高度小于600时起做用的样式 (+,600)区间

@media screen and (max-width: 600px){
    .hideContent{
        display:none;
    }
}

下面就是屏幕高度大于600时起做用的样式 (600,+)区间

@media screen and (min-width: 600px){
    .hideContent{
        display:block;
    }
}

下面就是屏幕高度大于600小于1200时起做用的样式 (600,1200)区间

@media screen and (min-width: 600px and (max-width: 1200px) ){
    .hideContent{
        display:block;
    }
}

媒介查询配合着flex布局牛逼啊