html - 字体大小为 :30px still autozooms when activated on mobile 的文本区域

Question

据我了解，将文本输入的 font-size 设置为大于 16px 的大小，应该会禁用在移动设备上激活文本输入时发生的自动缩放效果。

我将font-size设置为30px，但自动缩放效果仍然存在。在 iPhone 5 的 Chrome、Safari、UC、Mercury 和 Dolphin 上进行了测试。

这是一个实例:http://www.rouvou.com/pages/Stack%20Exchange 。这是评论区。 (用户必须先投票才能发表评论)

这是我的完整代码:

html

<div id="new-comment-mobile">
  <div id="new-good-comment">
    <%= form_for(@good_comment, remote: true) do |f| %>
      <%= f.text_area :text, maxlength: "650" %>
      <%= f.submit "Post" %>
    <% end %>
  </div>
</div>

CSS

#new-comment-mobile {
  position: relative;
  textarea {
    line-height: 130%;
    width: 80%;
    font-size: 30px;
  }
}

为什么浏览器仍然自动缩放？我真的不想禁用所有缩放功能...

Answer 1

在我的 iPhone 上通过 USB 使用 iOS 开发者工具，我可以看到您的 font-size: 30px 已通过。 @user1273587 无法通过 Chrome 开发工具看到此内容的原因是您的 @media 选择器仅更改移动设备上的字体大小。

根据我的测试，字体大小越大，设备放大的幅度就越小。根据我的测试，在大约 60 像素时，设备根本不会缩放。