高分辨率显示器上的分数CSS像素大小

Question

（我已经看过了;我不相信这是重复的：Are the decimal places in a CSS width respected?）

我按如下方式设置对象的大小：

.foo {
  height: 10.5px;
  width: 10.5px;
}

通常，这会减少;你不能使用半个像素。

也就是说，最新的Nexus 7有320dpi，而Android设备上的CSS像素定义为160dpi。在Nexus 7上使用400像素而非100像素绘制10px乘10px图像。

所以在高像素密度设备上 - 那些window.devicePixelRatio＆gt; 1.0 - 分数像素是有用的，还是只是丢弃了？

（谢谢！）

编辑，有点真实的例子。

我有一台MacBook Retina。我有一个21x21像素的图像文件。我希望它能在我的视网膜上显示，而不会以任何方式重新缩放;我希望文件中的每个像素对应屏幕上的一个像素。 CSS像素未链接到硬件像素，CSS中的1 px对应Retina显示屏或Nexus 7/10上的4px（2宽，2高）。

我希望能够指定图像的确切大小，以便它不会重新缩放，以便在加载图像后页面不会重排。我可以通过将图像放入设置为11x11的div，并将图像显示为100％来实现这一点，但这会增加一个额外的div，而且我是一个关于页面大小的触摸OCD。

Answer 1

他们被丢弃了。

我认为我得到了你想用小数像素实现的目标，但实际上你需要走的路线是为更高密度的显示器使用更高分辨率的图像。那应该做你想要的，不是吗？

我想不出任何理由你需要分数像素或任何类似的像素。

话虽如此，分数像素不起作用，但分数百分比不起作用。

.foo {
    height: 10.5%;
    width: 10.5%;
}

这将起作用，应该做任何你需要的小数像素（你需要从示例中明显改变百分比）。