媒体查询

移动端使用媒体查询兼容ipad等大屏幕设备

@media(min-width:700px){    //此处应注意css样式优先级的使用。否则优先级过低则样式不会生效
    #everyReport{    //建议媒体查询中的样式优先级高于原本的样式优先级,如这里使用id选择器
        margin-right: 10px!important;  //如这里,尽量不要使用!important,避免不必要的冲突
        &:nth-child(3n){
            margin-right: 0;
        }
    }
}
@media(min-width:980px){
    #everyReport{
        margin-right: 10px
        &:nth-child(4n){
            margin-right: 0;
        }
    }
}

你可能感兴趣的:(媒体查询)