在横向/纵向中保持一致的字体大小答案

【问题标题】：Maintain consistent font size in landscape/portrait在横向/纵向中保持一致的字体大小
【发布时间】：2016-03-01 08:10:24
【问题描述】：

我的 css 文件中有以下代码：

body {
    -webkit-text-size-adjust: 100%;
    -moz-text-size-adjust: none;
    -ms-text-size-adjust: 100%;
    font:  normal 75% 'Poppins', sans-serif;
}

当我纵向查看我的网站时，这很好。但是一旦我旋转成横向，我的字体就会放大到增加的大小。我希望字体完全保持原样。上面的代码似乎已经解决了许多其他人的问题，但是从我的屏幕截图中可以看出，与纵向相比，横向字体明显更大。

以下截图：

Portrait

Landscape

【问题讨论】：

标签： css mobile responsive-design

【解决方案1】：

原来这不是字体的严格问题...这是一个视口问题：

<meta name="viewport" content="width=device-width, initial-scale=1">

【讨论】：

【解决方案2】：

尝试将您的 css 字体拆分为：

font-family: 'Poppins', sans-serif;
font-size: 1.5em;

查看font-size documentation 以查看相对值、百分比值和长度值之间的差异。

【讨论】：