为什么我的网站在我的 iPhone Safari 浏览器上看起来不一样，我做错了什么吗？答案

【问题标题】：Why does my website look different on my iPhones Safari browser, am I doing something wrong?为什么我的网站在我的 iPhone Safari 浏览器上看起来不一样，我做错了什么吗？
【发布时间】：2013-03-19 13:33:36
【问题描述】：

我已经完成了 HTML 网站的设计，并在适用于 Google Chrome、Safari、IE 9、Firefox 和 Opera 网络浏览器的 Windows 计算机上查看了结果。在 Android 设备（三星 S3）上查看我的网站时，结果与在台式 PC/MAC 上查看的结果相同，但在我的 iPhone 5 或我的朋友 iPhone 4s 上查看时，结果不同。有些文本被放大了，而有些则没有。我很困惑，希望有人能尽快帮助我。

期待您的回复，并亲自了解我的意思：

 Visit http:///www.islandtoislandshipping.com

代码 HTML：

        <p id="intro">Island to Island Shipping and Removal LTD is a developing 
        organisation keen to<br />provide a high standard of service to its 
        customers. The company specialises in worldwide shipment of any household                 
        products or any goods, however, we<br />specialise directly to the Caribbean  
        (but that is not our limitation!). Island to Island Shipping and Removal LTD 
        provide an efficient, reliable and prosperous service<br />ensuring the highest  
        care is taken to in the process of delivery.</p>

        <img id="aim" src="imgs/aim.png" width="450" height="174" />

    <p>
    <br />As a company, we aim to provide our clients with all the 
    services they<br />require, from practical (shipping, removals) 
    to advise on packing materials<br />and household maintenance. 
    </p>

    <p id="stafftext">All our staffs are very friendly and courteous,<br />feel free to      
    discuss any queries you may have<br />and they will be happy to help. We are a<br   
    />dedicated team aiming to provide a stress<br />free experience for our customers.
    </p>

CSS 代码：

#intro{
position:relative;
margin-top:20px;
}

#aim{
margin-top:20px;
}

#stafftext {
position:relative;
margin-left:190px;
margin-top:90px;
 }

.staffimg {
margin-top:-100px;
}

#link1 {
position:relative;
margin-left:130px;
bottom:130px;
text-align:center;
font-size:9px;
 }

【问题讨论】：

您应该发布相关代码，而不仅仅是指向您网站的链接。
嗨 Matthew，您要我发布整个代码 (HTML) 和 (CSS) 吗？
欢迎来到网络浏览器的狂野世界。 :) 只发布与“文本放大”相关的 HTML 和 CSS。

标签： iphone html css xhtml safari

【解决方案1】：

我会尝试将-webkit-text-size-adjust: 100% 添加到您的CSS 中的body。它将禁用 iOS 设备上的文本大小调整。

https://developer.mozilla.org/en-US/docs/CSS/text-size-adjust
http://blog.55minutes.com/2012/04/iphone-text-resizing/

【讨论】：

【解决方案2】：

iPhone 浏览器不喜欢分割边距或填充 css 样式。尝试使用连接边距/填充方式。

而不是写：

margin-top: 90px;
margin-left: 190px;

试试：

margin: 90px 0 0 190px;

这是边距：右上左下；

【讨论】：