我有一些简单的HTML / CSS,我想在纵向的iPhone和iPad上大致填充浏览器窗口的高度。我开发的代码在iPhone上效果很好,很好地填充了代码。但是,在iPad上,它可能占据屏幕的一半。我已经尝试过在meta viewport
标记上进行各种缩放,宽度,高度等设置,但是找不到对两者都适用的内容。
是否可以将其设置为在两个方面均能很好地工作?如果可能的话,我也希望它能在Android上正常运行。
这是我正在使用的代码:
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0,
user-scalable=0, target-densitydpi=medium-dpi, maximum-scale=1.0"/>
<style>
.box {
border:0px solid ddd;
text-align:center;
font-size:750%;
font-family:Helvetica;
font-weight:bold;
margin:0 auto;
padding-bottom:10px;
}
.gaptop {
margin-top:10px;
}
</style>
</head>
<body>
<div class="box">+</div>
<div class="box">–</div>
<div class="box gaptop">3</div>
</body>
</html>
最佳答案
请参阅下面的链接。
1)Designing content for the whole iOS family和
2)Safari Web Content Guide
希望这对您有所帮助。