Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
419 views
in Technique[技术] by (71.8m points)

css - How do I combine two media queries?

How do I combine two media queries? One is for smaller devices and one for bigger devices, but only in portrait mode!

 @media only screen 
and (min-device-width : 320px) 
and (max-device-width : 480px) 
and (orientation : landscape){
#div {margin-top: 20px;}
}

}
@media only screen 
and (min-device-width : 481px) 
and (max-device-width : 1024px) 
and (orientation : portrait){
{margin-top: 20px;}
}
See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)

Not fully clear what you want to combine, but basically you separate them with a comma

eg

@media only screen and (orientation : landscape) , only screen and (min-device-width : 481px) and (orientation : portrait) { ...

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...