Media queries for tablet min-resolution and max-resolution

后端 未结 3 1202
轮回少年
轮回少年 2020-12-10 06:19

Currently working on a responsive design website. I use media query for targeting different devices based on the width and screen resolution.

  1. I have a scena

3条回答
  •  有刺的猬
    2020-12-10 06:42

    The resolution media query doesn't have good support in webkit browsers yet so you may have more success using device-pixel-ratio instead.

    http://bjango.com/articles/min-device-pixel-ratio/

    So we can restate your media query using resolution for those browsers that understand it (Firefox, IE9+, Opera), and device-pixel-ratio for all things webkit (Chrome, Safari, iOS and Android):

    @media only screen and (min-resolution:96dpi) and (max-resolution:264dpi) and (min-width:768px) and (max-width:1024px),
           only screen and (-webkit-min-device-pixel-ratio: 1) and (-webkit-max-device-pixel-ratio:2) and (min-width:768px) and (max-width:1024px) {}
    

提交回复
热议问题