固定宽度/高度 Div 中的相同字体大小在两台 PC 中显示不同。答案

【问题标题】：Same font size in a fixed width/height Div is displayed differently in two PCs.固定宽度/高度 Div 中的相同字体大小在两台 PC 中显示不同。
【发布时间】：2018-04-04 03:48:09
【问题描述】：

当查看具有固定（高度/宽度）div 和固定内容的 web 应用程序时，在不同的 PC 中显示非常不同（即：更大的字体、换行符）。

两台PC的JS像素深度相同。

Screenshot : The webapp in PC-1

Screenshot : The webapp in PC-2

在第一台 PC 中 - 内容出现在一行中在第二台 PC 中 - 内容出现在两行中（与第一台 PC 比较）

尝试使用相同的分辨率 - 但内容看起来仍然不同。

这是因为 CSS 像素和设备像素不同吗？

如果有什么方法可以使内容在所有 PC 显示器上显示相同，请在此处回答。（不改变字体大小和缩放属性）

提前致谢。

【问题讨论】：

使用一组css重置规则。用户可以在浏览器中设置默认字体和大小，每个显示的字体和大小可能不同
字体不同。您的电脑没有可用的相同字体。不同的字体具有外观和大小。您可能需要使用网络字体以确保它在两台计算机上都可用和使用
@RomanCortes 谢谢，它成功了。

标签： javascript html css

【解决方案1】：

我建议使用normalize.css。无样式的网站在每个操作系统上看起来都不同，因为有各种默认字体和特定于操作系统的样式，例如 line-heights 和 font-sizes。

至于字体，只需在您的项目中嵌入一些字体即可。如果您不指定字体，Windows 将回退到 Times New Roman 等。

【讨论】：

最主要的是他使用了 2 diff。操作系统不是 PC 的，好建议
是的。我现在正在使用网络字体，它工作得很好。

【解决方案2】：

我不知道你是否上传了你的字体文件。但这是一种在 css 中获取字体的方法：

@font-face {
  font-family: main-font;
  src: url(nameOfFontFile.ttf);
}

在您的 css 文件中按字体使用名称 main-font。

#someId {
  font-family: main-font;
}

【讨论】：