html - How to create a media query that applies to all iPads in portrait?

Question

The problem is that the old iPad has 768 x 1024 px resolution while the new ones have 1536 x 2048 px resolution. How can I address bot iPads for portrait in one media query? Is this possible?

<link rel="stylesheet" href="stylesheets/device.css" media="only screen and (((min-width:768px) and (max-width: 1024px)) or ((min-width:1536px) and (max-width: 2048px)))">

I couldn't find examples where media query conditions are nested like this.

Answer 1

@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) { /* STYLES GO HERE */ }

看到这个链接希望它对你有用