奇怪的 html 在 android 上渲染 google chrome

Question

这个非常简单的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>

显示在 google chrome on android 4.1.2 中 "Label:" 和输入字段的字体非常小。

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

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

P.S。在两个 "p" 中放置较少的文本可以使其正常工作。

Answer 1

将此添加到标题

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

奇怪的 html 在 android 上渲染 google chrome

strange html rendering on android with google chrome

html

android

google-chrome