stylesheet - 以像素为单位的元素大小，为什么..？

Question

我是一名网络开发人员...... 12 年了，其中很多是业余爱好，最近 5 年是专业的。但是我仍然无法解决以下问题，这可能是一个非常愚蠢的问题，尤其是来自我的问题，但是:

为什么我们仍然使用像素来表示尺寸？

大约两三年前，我看到了新的 HiDPI 屏幕的曙光，比如 iPhone 4。我真的很想知道这将如何影响我们的网页设计和网页开发。我在一家广告公司工作，并且比一般的网络开发者更了解打印品(例如，在纸上或其他实物上打印)。当我考虑我们下一步要去哪里时，我在考虑打印品；它们不依赖于像素(或点使用正确的术语)的大小，这绝对是愚蠢的。因为，如果您将文档发送到打印机，则在开始设计文档之前，您需要知道该设备的 DPI。这就是为什么他们使用公制(或英制或其他)尺寸，然后只是提前决定他们最终将支持多高的 DPI。 (300 DPI 是一个相当标准的最大值)

所以，我对上述问题的回答(两年前)是:我们可能会为设备使用指标或其他非像素相关的测量系统。因为我们会有很多不同 DPI 的设备。这几乎是我们可以确保设备按应有的方式显示网站的唯一方法。

现在，两年后，我们一直在使用其他一些解决方案。这仍然更像是解决方法，而不是针对各种屏幕设置的真正解决方案。

我对度量系统的期望是错误的吗？有什么我忽略的东西会使这个解决方案变得不可能吗？是否已经存在我忽略的真正合乎逻辑的解决方案？

Answer 1

像素是屏幕的固定格式，如您所知，所有可查看的网络设备都是通过屏幕(显示器、平板电脑、手机等)。正如您所说的那样，DPI 和 PPI 是非常不同的东西，但是由于我们的屏幕不关心点，所以它可以工作。

但是，它不会像(例如对于字体) % 和 "em"那样缩放。

为了进一步解释 px 和它的固定大小，下面是这个 W3.org 页面的一小段引述:

要了解 px 的外观，请想象一下 1990 年代的 CRT 计算机显示器:它可以显示的最小点约为 1/100 英寸(0.25 毫米)或更多。 px 单位得名于这些屏幕像素。

现在有些设备原则上可以显示较小的尖点(尽管您可能需要放大镜才能看到它们)。但是上个世纪在 CSS 中使用 px 的文档看起来还是一样的，不管是什么设备。尤其是打印机，可以显示比 1px 细得多的清晰线条，但即使在打印机上，1px 线条看起来也与在计算机显示器上看起来非常相似。设备发生变化，但 px 始终具有相同的视觉外观。

现在，关键是它取决于您想要的布局 - 我们有 %、px、pt、em (等)，我们可以选择使用(或不使用)这些工具来完成手头的任务。许多人不会使用根据设备重新缩放的方法(我们对此有自动检测)，而对于其他人来说，它非常适合。

对我来说，任何可缩放的问题都很难在整个设计中相对缩放......在更高或更低分辨率的浏览器中，您的文本可能出现在一行上或需要覆盖多行。如果这是至关重要的，那么使用像素来修复它。

这也是为什么这么多网站都居中的原因(包括这个)。它给人的错觉是整个屏幕都被占用了，但事实并非如此——左右边缘都有空白，这并不重要——内容清晰，设计师可以控制。

我无法计算我的客户要求缩放多少次(违背我的建议)然后遇到布局问题——你可以猜到我对此很感兴趣。

然而，很酷的是将两者一起使用 - 将固定像素尺寸作为包装器并在内部使用 % 或类似内容 - 这再次提供了流动性的错觉而不会失去太多控制。

我认为您的问题不会得到直接答案，因为恐怕这将是非常基于意见的。