1

（我已经看过了；我不相信这是重复的：CSS 宽度中的小数位是否受到尊重？）

我将对象的大小设置如下：

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

通常，四舍五入；你不能使用半个像素。

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

所以在高像素密度设备上——那些window.devicePixelRatio > 1.0的设备——小数像素是有用的，还是被丢弃了？

（谢谢！）

编辑，一个有点真实的例子。

我有一个 MacBook 视网膜。我有一个 21x21 像素的图像文件。我希望它显示在我的视网膜上而不以任何方式重新缩放；我希望文件中的每个像素对应于屏幕上的一个像素。CSS 像素与硬件像素无关，CSS 中的 1 像素对应于 Retina 显示器或 Nexus 7/10 上的 4 像素（2 宽，2 高）。

我希望能够指定图像的确切大小，以便它不会重新缩放，并且一旦加载图像，页面就不会重排。我可以通过将图像放入设置为 11x11 的 div 中，并将图像显示为 100% 来做到这一点，但这会增加一个额外的 div，而且我对页面大小有一点强迫症。

4

1 回答 1

1

它们被丢弃。

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

我想不出任何你需要小数像素或类似的东西的原因。

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

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

这将起作用并且应该执行您需要分数像素的任何操作（您需要从示例中明显更改百分比）。

于 2013-10-20T03:04:38.430 回答