Em字体大小不会在iOS中扩展

Question

我过去做得很好，但是我正在建设的这个新网站上的内容并未正确地进行。

我的问题是，当在iPhone（5，这是我可以测试的）肖像模式中查看网站时，字体大小保持很小。它们相对于em尺寸没有扩大。当我挤压我的桌面浏览器时，它可以正常工作（例如左下图），但在iPhone上，类型仍然很小。

直播网站：http://debbiemillman.com/designmatters/totest/index.html

实时CSS：http://debbiemillman.com/designmatters/totest/_css/style.css

我的-webkit-text-size-adjust：100％也在那里。

任何想法我做错了什么？

Answer 1

尝试将您目前拥有{view = {1}}的视口元标记更改为以下内容：

<meta name="viewport" content="width=1080" />

我认为应该纠正此事;它是与iPhone和其他设备一起使用的正常设置组合。

Answer 2

有几件事需要考虑 你在html.css style.css和reset.css中有h3冲突css。

reset.css第20行指定100％ reset.css第70行指定13px html.css第180行指定1.17em。
在FireFox中，流行的是style.css第54行指定2em。

指定CSS一次。考虑不使用h3而是使用  <p class="headline">
作为标题浏览器样式表并不总是那么容易覆盖。段落标签可以改变。

如果你使用id而不是类，它将被赋予更高的优先级，并且可能在所有浏览器中更加一致。

不确定为什么但FireFox会显示reset.css被加载两次。

查看时间线瀑布，您可以很晚地加载一些字体文件并按住“开始渲染”。所有CSS和字体文件都应该在任何JS之前加载，因为浏览器必须在加载时解析JS，然后必须在加载新的CSS或字体时重置初步布局。

注意第18-23行，然后在最终加载23个DOM内容之后。

WebPageTest Waterfall

另一个奇怪的事情是相对较小的图像文件需要一秒钟才能加载。当服务器的dta传输速率非常快时，这一点尤其奇怪。而jquery和script.js上的404错误并不好。

Base Page Size: 20,029 Bytes
Transmission Speed: 11,506,849 Bytes/Sec.
Compression: 7.9X
HTML Whitespace: 37.3%
Bytes Transmitted: 2,520 Bytes
HTML Transfer Rate: 91,456,621 Bytes/Sec.

这就是它在WP 8.1上的表现。不是真的，当它是实际尺寸时，很难阅读。缺乏高对比度无济于事。