我用HTML完成了一个网站的设计,并在一台Windows电脑上用Google Chrome、Safari、IE 9、Firefox和Opera浏览器检查了设计结果。当我在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;
}
我会尝试将-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/
iPhone浏览器不喜欢分割边距或填充css样式。尝试使用连接边距/内边距的方式。
不写:
margin-top: 90px;
margin-left: 190px;
试题:
margin: 90px 0 0 190px;