使用谷歌浏览器在android上呈现奇怪的html答案

【问题标题】：strange html rendering on android with google chrome使用谷歌浏览器在android上呈现奇怪的html
【发布时间】：2015-03-22 05:56:44
【问题描述】：

这个非常简单的html文件

<!DOCTYPE html>
<html>
<head>
<title>My Page</title>
</head>

<body>
    <h1>Header</h1>
    <p>Paragraph with some text. Paragraph with some text. Paragraph
        with some text. Paragraph with some text. Paragraph with some text.</p>
    Label: <input type="text"> <br /> 
    <input type="submit" value="Button">
    <p>Paragraph with some text. Paragraph with some text. Paragraph
        with some text. Paragraph with some text. Paragraph with some text.</p>
</body>
</html>

在 android 4.1.2 上的 google chrome 中显示，“标签：”和输入字段的字体非常小。

如何使标签和段落的字体大小相同？

即使我为所有部分（标签和输入用“p”包裹）指定 style="font-size: 24px"，标签和输入仍然以小得多的字体显示尺寸。你可以在这里测试：link to the above html

附：在两个“p”中放置较少的文本使其正常工作。

【问题讨论】：

此内容当前未包含在 p 左右，因此它可能采用父级（body ？）的样式或默认样式。当您将它们实际包装成 ptag 时会发生什么？此外，它可能有助于检查您的代码并识别对这些元素应用的 CSS……答案很可能就在那里。
我不知道为什么，但是将“错误”元素的字体大小加倍似乎可以解决问题。然而，这不是一个干净的解决方案。编辑：i.imgur.com/nhU3Ybg.png
包装在 p 中不会改变它。不涉及 css。 - “字体大小加倍”是什么意思

标签： android html google-chrome

【解决方案1】：

将其添加到头部

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

【讨论】：

这实际上修复了它，谢谢！