Javascript 如何使字体大小独立于屏幕分辨率和显示器大小？

我正在开发一个应用程序，我想使字体大小独立于屏幕分辨率和屏幕大小。所有分辨率和所有屏幕大小的字体大小应相同。如何使用javascript和css实现这一点

我认为每点像素数与硬件有关，所以我不确定javascript和css是否可以访问它

我尝试了许多替代方案，但找不到确切的解决方案。

老式的应该行得通

例如：

<style>
p
{
    font:15pt;
}
</style>

P
{
字体：15pt；
}

这使得html的每个同级元素都给出了一个相对大小，这意味着

body { font-size: 100% } /* is 14px now */

也

div { font-size: 1em } /* should be 14px also */

还可以使用javscript更改html字体大小，并且所有相关大小都应按预期工作。使用jQuery，您可以访问正文的字体大小，并将其设置为根据屏幕大小计算的某个大小。即使是在不同的设备中，任何类型的应用程序的工作规则都是

@media（）{yourccss here}

var fontsize=14+'px';
jQuery('body').css('font-size',fontsize);

---

您不能这样做，因为您无法确定用户监视器的真实大小，除非您可以控制正在使用的计算机

一个用户可以在中同时连接两个监视器，并进行设置，以便屏幕上的相同元素以不同的大小显示在每个监视器上。

您可以使用点（

pt

），这些点基于1/72英寸。这是一个传统上来自印刷的单位。现在，这取决于设备是否正确配置，以及每个监视器的大小是否相同。通常情况下并非如此，但有些设备知道它们的物理屏幕大小。您还可以在中使用英寸

、厘米
cm
和毫米
mm

将此尺寸与相对尺寸的ems一起使用。这样，整个站点可以根据需要进行放大和缩小

body {
    font-size: 12pt;
}
h1 {
    font-size: 2em;
}
p {
    font-size: 1.1em;
}

您可以使用cm和mm：

<span style="font-size: 2cm;">i am big</span>
<span style="font-size: 2mm;">i am tiny</span>

我是大块头
我很小
没有好的通用解决方案。在我看来，你应该认为这是不可能的。最近发表了一篇文章，提出了解决这个问题的（长期）方案。这是长期的，因为这取决于多个参与者（硬件和软件制造商）的努力

引用作者的话：

我们可以把机器人送上火星，这是荒谬的，但在网页上呈现一个字形并自信地说：“如果你用尺子在屏幕上测量这个字形，它将恰好是10毫米宽。”

正如其他人所说，字体大小不能完全独立于屏幕分辨率。您可以使用媒体查询来针对不同的屏幕大小，并相应地调整字体大小

body { font-size: 16px; }
@media screen and (min-width: 600px) {
    body { font-size: 112.5%; }
}
@media screen and (min-width: 800px) {
    body { font-size: 125%; }
}
@media screen and (min-width: 1000px) {
    body { font-size: 137.5%; }
}
@media screen and (min-width: 1200px) {
    body { font-size: 150%; }
}

这些只是示例值——你必须用不同大小的应用程序进行实验，看看什么看起来最好。网站就是一个很好的例子——调整浏览器窗口的大小，看看文本大小会发生什么变化

如果您使用em或rem单位调整所有字体的大小，您只需调整主体字体大小，其余值将按比例缩放。
如果用户将其计算机连接到投影仪，会发生什么情况？我可以理解您问题的本质，但对于视力受损者的可访问性和可用性，这可能是一条危险的线路。@rimunro，我没有这个要求，在我的应用程序中，我只需要保持计算机显示器的字体大小。
pt
单元和任何CSS单元一样，可能取决于屏幕分辨率，请看，值得一提的是，之所以这样做是因为点与英寸而不是像素相关。使用
.2in
也可以。所有这些，在CSS中，点和英寸取决于分辨率，所以它们永远不会是独立的。它不是通用的，但一些设备的配置方式是它经常工作的。移动设备尤其如此。通过媒体查询，您可以知道客户端的显示大小。@Nelson，媒体查询与此无关。如果客户机知道它的维度，那么物理单元将在所有CSS、媒体查询中工作。许多客户端不知道它们的物理显示尺寸，但许多客户端知道。@rimunro，然后我可以制作一个应用程序，用户可以在其中选择它们的屏幕尺寸。例如，如果用户有屏幕24英寸宽屏液晶显示器，那么如何做到它的分辨率独立？我希望这真的工作。。。在一些监视器上试用，然后测量结果。@bfavaretto，但它确实如此！在一些移动设备上试用，然后测量结果。它不是万能的。。。甚至不接近。。。“但是它在很多情况下都能起作用。”布拉德，我刚在iMac和iPhone上试过，结果两种情况下都不起作用（下降了约25%）。也许它只适用于字体，而不适用于一般大小？呵呵，是的，因为在50x50px的屏幕上，字体大小为16px是没有意义的，所以相对ppi或dpi的设置可以让您读取信息，而不是正确设置样式。
body { font-size: 16px; }
@media screen and (min-width: 600px) {
    body { font-size: 112.5%; }
}
@media screen and (min-width: 800px) {
    body { font-size: 125%; }
}
@media screen and (min-width: 1000px) {
    body { font-size: 137.5%; }
}
@media screen and (min-width: 1200px) {
    body { font-size: 150%; }
}