html - 在 iOS 上字体太小但在 Android 和桌面上没问题？

Question

iOS 手机/平板电脑是否存在无法调整我的字体和 css 设置的问题？当我查看您在 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

问题不在于字体大小，而在于您如何使事物具有响应性。您应该摆脱固定宽度并用最大宽度替换它们。您还应该将 img {max-width: 100%;} 添加到图像中。当你这样做时，一切都会得到适当的响应，一路解决你的问题。我已经在这个文件中修复了它:https://jsfiddle.net/uek15fmq/