我目前所在的网站需要在屏幕宽度和像素密度方面做出充分响应。我的主要问题是如何获得像galaxy s4这样的HiDPI设备的响应能力。
我读过关于最小设备像素比的文章，但我没有完全理解，我的尝试也没有奏效。我所有的less/css都使用rems作为单位，所以基本上我应该能够操作字体大小和html标签，以获得我想要的，对吧？但也许这是胡说八道？
然而，我想请教一下最佳实践、技巧和窍门。对我来说重要的是，我没有桌面和移动设备的多个版本或子域。我想通过媒体查询来完成这一切。
事先非常感谢。我真的很感谢你的帮助！
干杯
Hidpi仅意味着1个css像素用3x3实际像素渲染（这因设备而异，iPhone像素密度为2，因此iPhone上的1个css像素由4个实际LCD像素组成。）galaxy s4上的网站仍然渲染为360x640px，像素密度为3，因此Hidpi设备不需要任何额外的css。
你只需要在年度头部分中添加这个元标签
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
并将css应用于常规非HiDPI设备。
要添加pankijs所写的内容，请注意，不同的浏览器（chrome、android原生浏览器、firefox等）以不同的方式处理媒体查询。例如，如果您使用：
@media only screen and (max-width : 480px)
它可以在桌面Chrome浏览器和安卓智能手机浏览器上运行，但不能在iPhone上的Safari上运行。要使其在Safari上工作，您必须使用：
@media only screen and (max-device-width : 480px)
结论是，您需要在物理设备上测试媒体查询：）有关更多信息，请查看此页面：http://www.w3.org/TR/css3-mediaqueries/