具有恒定像素字体大小的响应式文本大小?

时间:2016-01-25 03:55:19

标签: css mobile responsive-design font-size

在移动版https://www.gofundme.com/之类的网站上,文字大小具有响应性,但有效font-size保持不变,如34px。

Here's the same view on different screen sizes.

当我更改窗口的大小时,网站文本的大小与屏幕大小成正比。当屏幕为500px时出现在第二行的单词仍然在第二行,即使屏幕宽度完全不同(200px对2000px)。在所有屏幕尺寸上,从最后一个字母到右边屏幕边缘的相对距离是相同的。

由于font-size以像素为单位,我希望单词的位置取决于屏幕尺寸,但gofundme.com上的情况并非如此。

这是怎么做到的?

1 个答案:

答案 0 :(得分:1)

我认为这是由于<head>中指定的固定视口大小:

<meta name="viewport" content="width=640, user-scalable=no">

这导致整个页面缩放以适应设备(保持640px宽视口的比例),而不是调整大小和移动的单个内容元素。