首页 > 技术文章 > 常用CSS媒体查询

appleat 2019-08-15 16:37 原文


@media screen and (orientation: portrait) {
/*竖屏 css*/
}
@media screen and (orientation: landscape) {
/*横屏 css*/
}
@media screen and (min-width:1366px){
/*pc端 css*/
}

/*iphone 5/5s/5se */
@media screen and (max-width:569px){
top: 7%;
left: 18%;
}
/*iphone 6/7/8 */
@media screen and (min-width:569px) and (max-width:668px){
top: 12%;
left: 20%;
}
/*iphone 6p/7p/8p */
@media screen and (min-width:668px) and (max-width:737px){
top: 14%;
left: 20%;
}
/*iphone x */
@media screen and (min-width:737px) and (max-width:813px){
top: 12%;
left: 21%;
}
/*ipad*/
@media screen and (min-width:813px) and (max-width:1025px){
top: 22%;
left: 21%;
}
/*ipad pro*/
@media screen and (min-width:1024px){
top: 25%;
left: 21%;

}

推荐阅读