所以我有以下情况： $iphone : 320px (max-height 568px); 这是iphone的尺寸。但是，当我将浏览器的大小调整为这些确切值时，媒体查询将不起作用。如果我通过使用浏览器扩展检查显示大小来输入视口而不是这个，它就可以工作。我应该使用设备宽度和高度还是视口？使用视口似乎很奇怪。
这是我的断点变量示例：我是否通过添加“设备”来解决问题？我必须向所有这些添加“设备”吗？
/* 摩托罗拉 RAZR V8 (240 x 320) */
$motorola-portrait : 240px (最大设备高度 320px);
/* 黑莓 8300 (320 x 240) */
$blackberry-portrait : 320px (max-device-height 240px);
/* iphone 3-4 (320 x 480) */
$iphone4-portrait : 320px (max-device-height 480px);
/* iphone 5 (320 x 568) */
$iphone5-portrait : 320px (max-device-height 568px);
/* 三星 Galaxy S3/S4 (360 x 640) */
$samsunggalaxy-portrait : 360px (max-device-height 640px);