媒体查询macbook pro 15“

Question

我正在尝试将笔记本电脑15“和更小的媒体查询应用，但没有成功。

这是我的媒体查询：

@media screen and (min-device-width: 1200px) and (max-device-width: 1600px) and (-webkit-min-device-pixel-ratio: 1) { }

和

@media screen and (min-device-width: 1200px) and (max-device-width: 1600px) and (-webkit-min-device-pixel-ratio: 2)  and (min-resolution: 192dpi) { }

我为13英寸macbook pro工作，但15英寸没有。

非常感谢任何帮助。

由于

Answer 1

这可能是min-device-width的问题，因为它应该仅适用于移动设备（平板电脑，智能手机）：

  

最小设备宽度

尝试使用它们（不含-device-），以便在计算机的浏览器上进行测试。

  

min-width或max-width

桌面样式

@media screen and (min-width: 1025px) and (max-width: 1280px) {

   /* Styles for Desktops */
 }

同时添加内部标记

<meta name="viewport" content="width=device-width, initial-scale=1">

Answer 2

Retina显示媒体查询

@media only screen and (-webkit-min-device-pixel-ratio : 1.5), only 
screen and (min-device-pixel-ratio : 1.5) { styles }

Answer 3

 /*--cover up mac , mac-book---*/

@media only screen and (min-width: 1024px) and (max-width: 1920px) {}

/*--mac book pro , and mac-book retina display screen---*/

@media only screen and (min-width: 1920px) and (max-width: 2560px) {}