什么是每英寸点数和每英寸点数
在访问jsfiddle.net时，我从Chrome开发者工具控制台标签中收到了此消息：
考虑使用“dppx”单位而不是“dpi”，因为在CSS中，“dpi”是指每英寸点数，而不是每英寸点数，因此不符合屏幕的实际“dpi”。 在媒体查询expression式中：只有屏幕和（-webkit-min-device-pixel-ratio：2），不是全部，不是全部，只有屏幕和（最小分辨率：192dpi），只有屏幕和（最小分辨率：2dppx）
它是蓝色的，所以我假设这不是一个警告或错误。 那么为什么我会遇到这个消息？ 我怎么能摆脱它，或者这只是jsfiddle本身的问题？
这与苹果视网膜显示器相关，但也许不限于此。 这些显示器具有比以前使用的屏幕更高的像素密度，但浏览器仍然具有相同数量的像素。
例如iPhone 3GS具有320×480像素的显示器，而iPhone 4则以640×960像素发布。 但是，浏览器并没有以该分辨率显示网站，而是假设其分辨率为320 x 480像素。
这导致了CSS-像素的发明。 如果在CSS中指定width:100px ，那么在正常显示中将是100物理像素，但在视网膜显示器上将是200物理像素。 iPhone 3GS和iPhone 4都具有相同的dpi （因为它基于伪装的CSS像素），但dppx却非常不同（因为它基于真实的物理像素）。
您可以使用dppx来检测客户端何时具有高像素密度屏幕，并为其提供不同的样式，即使客户端的浏览器假设其像素密度不高。
.comp { background-image: url(image.png); } @media only screen and (min-resolution: 2dppx) { .comp { background-image: url(image@2x.png); } }
有关CSS像素的更多信息： https ： //developer.mozilla.org/en-US/docs/Web/CSS/resolution
