媒体查询响应式布局

2023-11-04

/***************移动端样式开始***************/
/***************移动端共用样式开始***************/
@media screen and (min-width:320px) and (max-width:1169px){

}
/***************移动端共用样式结束***************/
/***************768-1169样式开始(1169根据设计图内容宽度来定)***************/
@media screen and (min-width:768px) and (max-width:1169px){

}
/***************768-1169样式结束***************/

/***************414-767样式开始***************/
@media screen and (min-width:414px) and (max-width:767px){
    .ads {
        display:none;
    }
}
/***************414-767样式结束***************/
/***************375-413样式开始***************/
@media screen and (min-width:375px) and (max-width:413px){
    .ads {
        display:none;
    }
}
/***************375-413样式结束***************/
/***************360-374样式开始***************/
@media screen and (min-width:360px) and (max-width:374px){
    .ads {
        display:none;
    }
}
/***************360-374样式结束***************/
/***************320-359样式开始***************/
@media screen and (min-width:320px) and (max-width:359px){
    .ads {
        display:none;
    }
}
/***************320-359样式结束***************/
/***************移动端样式开始***************/

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

媒体查询响应式布局 的相关文章