css - 你必须在媒体查询中使用设备像素比吗？

Question

我只需要澄清一个关于设备像素比的问题，我必须在我的媒体查询中使用它吗？如果我不这样做，它会以某种方式影响他们吗？我的意思是，有很多设备使用 360X640 屏幕分辨率，例如:

三星 Galaxy S6(360X640，4dpr)索尼 Xperia Z(360X640，3dpr)三星 Galaxy Note II(360X640，2dpr)

因此，如果我只对纵向和横向进行 2 个媒体查询，如下所示:

<link rel="stylesheet" media="only screen and (device-width : 360px) and (device-height : 640px) and (orientation : portrait)" href="style360.css"/> 
<link rel="stylesheet" media="only screen and (device-width : 640px) and (device-height : 360px) and (orientation : landscape)" href="style640.css"/> 

这样做会有什么不同吗:

<link rel="stylesheet" media="only screen and (device-width : 360px) and (device-height : 640px) and (-webkit-device-pixel-ratio: 2) and (orientation : portrait)" href="style360.css"/> 
<link rel="stylesheet" media="only screen and (device-width : 640px) and (device-height : 360px) and (-webkit-device-pixel-ratio: 2) and (orientation : landscape)" href="style640.css"/>
<link rel="stylesheet" media="only screen and (device-width : 360px) and (device-height : 640px) and (-webkit-device-pixel-ratio: 3) and (orientation : portrait)" href="style360.css"/> 
<link rel="stylesheet" media="only screen and (device-width : 640px) and (device-height : 360px) and (-webkit-device-pixel-ratio: 3) and (orientation : landscape)" href="style640.css"/>
<link rel="stylesheet" media="only screen and (device-width : 360px) and (device-height : 640px) and (-webkit-device-pixel-ratio: 4) and (orientation : portrait)" href="style360.css"/> 
<link rel="stylesheet" media="only screen and (device-width : 640px) and (device-height : 360px) and (-webkit-device-pixel-ratio: 4) and (orientation : landscape)" href="style640.css"/>

只是我在网上找到的每一个关于媒体查询的教程或解释都在查询中包含了设备像素比，我试图在网上寻找信息，看看它是否是必须的，但不能找到任何东西。

Answer 1

要回答您的第一个问题，不，您不必在媒体查询中使用设备像素比。

对于第二个问题，两组链接标签并不等价，因为第二组不考虑像素比等于 1 或大于 4。第一组链接标签可能是您应该使用的.