2K和更高分辨率设备上的字体大小

Question

我有一个分辨率为1680 x 1050的屏幕。

我是一名网站开发人员，在构建网站时，我们使用的font-sizes可在笔记本电脑上轻松阅读，分辨率介于1366 x 768到1920 x 1080之间。

在使用 Chrome开发者工具时，我选择了亚马逊Kindle Fire HDX ，其分辨率为2560 x 1600。在此设备上（Chrome正在模拟），由于高分辨率，字体大小渲染非常小。我尝试了许多字体大小的单位，例如vw, vh, %，以便字体大小在所有分辨率上显示相同但失败。

我甚至使用Chrom Dev Tool打开了StackOverflow，看到字体大小看起来太小了。我不知道真正的Kindle HDX上出现的字体大小是否与我在Kindle HDX上看到的铬正在模拟的相同，我没有真正的2K res设备也测试我的网站。如何解决这个问题？我希望我的网站在所有分辨率下都可读。

Answer 1

我建议您使用em作为字体的单位，以使其更具跨浏览器/设备兼容性。 em应该使用浏览器自带的内置字体大小，以使事物更易读，以及浏览器的缩放设置。

此外，您可能希望尝试各种CSS框架，这些框架可能会尝试处理更一致的跨浏览器/设备一致性，以根据设备/ dpi设置将字体保持在更大的相对大小。 （不幸的是，我没有这方面的经验，但应该是开始研究的好地方）。

Answer 2

如果您的字体大小是相对单位，那么您可能就好了。

我认为您在Chrome开发工具中看到的是＆＃34;缩放以适应＆＃34;该功能可缩放目标设备的页面以适合 您的浏览器窗口 。取消选中＆＃34;缩放以适应＆＃34;我想你会看到文字清晰可辨。并注意到标尺值也将变为更准确的表示。

您可以在此屏幕截图中看到，标尺表示设备模拟的渲染宽度为1600px，即使此截图绝对不是以1600px宽度拍摄的。它被缩放到适合我的窗口。