iOS上的字体太小但是在Android和桌面上很好吗？

Question

iOS手机/平板电脑有什么不能调整我的字体和CSS设置的大小吗？当我在Android上查看您的视图时，它工作正常。有人可以解释或帮助我解决方案吗？见下图：

的Android

的iOS

链接：https://jsfiddle.net/w9357vxo/ 这是一个代码段：

<div class="twocol smwidth">
    <div class="col1">
         <h2>The Situation</h2>
         <p>
    For vacationers, deciding to take a cruise is exciting, but choosing the right one requires a great deal of information, cost consideration, and input from friends and family. Carnival wanted to make the process easier by recommending cruises that would best suit the lifestyles, demographics and interests of their passengers.
         </p>
         <p>
    They also wanted to make it easy to share details with travel companions. Carnival needed a more personalized communication strategy to help their prospective passengers navigate through the decision process.
         </p>
     </div>
     <div class="col2">
         <h2>The Solution</h2>
         <p>
    Carnival collected email addresses on their homepage as part of the lead generation efforts, but  Nimblefish helped them to capture additional relevant data that would lead to a more personalized communication.  Prospective passengers were asked:
         </p>
         <ul class="list">
             <li>Tell us about yourself! (Are you a Family with small kids? Teens? A group? Single?)</li>
             <li>Where do you want to go? (Alaska? Mexico? Caribbean? Undecided?)</li>
             <li>How do you do fun? (Relax in the sun? Shopping? Explore Nature? Island Adventure?)</li>
             <li>Are you new to cruising? Are you a former guest of Carnival? Where do you live?</li>
        </ul>
    </div>
 </div>

css：

h1 {
  margin:0;
  margin-bottom:25px;
  padding:0;
  font-size:24px;
  font-weight:700;
  text-align:center;
}
h2 {
  margin-bottom:20px;
  padding:0;
  font-size:18px;
  font-weight:800;
}
p {
  font-size:17px;
  color:#808285;
}
.list li {
  font-size:17px;
  color:#808285;
}

Answer 1

问题不在于字体大小，而是你如何使事情响应。你应该摆脱固定的宽度，并用最大宽度替换它们。您还应该将items()添加到图像中。当你这样做时，一切都将正确响应，一路上解决你的问题。我在此文件中修复了它：https://jsfiddle.net/uek15fmq/

Answer 2

方法是（一如既往）：第1步 - 使所有浏览器的行为相同。第2步 - 解决问题。可以禁用Android上的字体提升功能：https://gist.github.com/mojoaxel/7469194。媒体查询可以解决小字体问题：http://www.w3schools.com/cssref/css3_pr_mediaquery.asp。这有帮助吗？

示例：

{{1}}