CSS macbook pro 15" 的媒体查询
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/30538086/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
media Query for macbook pro 15"
提问by flo bee
I'm trying to apply media query for laptop 15" and smaller with no success.
我正在尝试为 15" 或更小的笔记本电脑应用媒体查询,但没有成功。
Here is my media query:
这是我的媒体查询:
@media screen and (min-device-width: 1200px) and (max-device-width: 1600px) and (-webkit-min-device-pixel-ratio: 1) { }
And:
和:
@media screen and (min-device-width: 1200px) and (max-device-width: 1600px) and (-webkit-min-device-pixel-ratio: 2) and (min-resolution: 192dpi) { }
I works for 13inch macbook pro but no for the 15".
我为 13 英寸 macbook pro 工作,但不为 15 英寸工作。
Any help would be much appreciated.
任何帮助将非常感激。
Thanks
谢谢
采纳答案by Michael Money
It might be a problem with min-device-width
, as it should only work on mobile devices (tablet, smartphones):
可能有问题min-device-width
,因为它应该只适用于移动设备(平板电脑、智能手机):
min-device-width
最小设备宽度
Try using those (without -device-
) so you can test it on your computer's browser.
尝试使用那些(没有-device-
),以便您可以在计算机的浏览器上进行测试。
min-width or max-width
最小宽度或最大宽度
Styles for Desktop
桌面样式
@media screen and (min-width: 1025px) and (max-width: 1280px) {
/* Styles for Desktops */
}
Also add inside tag
还添加内部标签
<meta name="viewport" content="width=device-width, initial-scale=1">
回答by someone
Retina Display media queries
Retina Display 媒体查询
@media only screen and (-webkit-min-device-pixel-ratio : 1.5), only
screen and (min-device-pixel-ratio : 1.5) { styles }