Ipad 视口纵向问题
Ipad viewport portrait issue
我有一个网页出现在 ipad 上。我的 body 网页宽度为 960px,高度可变。
我为视口添加了这个元数据:
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"/>
我想在屏幕上看到 100% 的网页。它在横向模式下运行良好,但我无法找到如何修改我的视口以在横向和纵向模式下查看 100% 的网页。
目前我看到我的网页宽度的 60% 是纵向的。
我不想添加 JS 脚本或媒体查询。我的网页没有响应。
你有一个静态宽度,iPad在纵向模式下的宽度更小。在不调整静态宽度的情况下解决这个问题是不可能的。也许你仍然应该考虑 JS 或媒体查询。这是一个包含有关尺寸的更多信息的网站:http://www.websitedimensions.com/
我通过使用此代码实现了我的目标:
@media only screen
and (min-device-width: 768px)
and (max-device-width: 1024px)
and (orientation: portrait) {
body {
width: 768px;
}
}
显然它是 Ipad 的特定代码,但它也适用于 Nexus 9.0 和 Surface。
如果有人有 JS 脚本来做完全相同的事情,我有兴趣检查一下。
我有一个网页出现在 ipad 上。我的 body 网页宽度为 960px,高度可变。
我为视口添加了这个元数据:
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"/>
我想在屏幕上看到 100% 的网页。它在横向模式下运行良好,但我无法找到如何修改我的视口以在横向和纵向模式下查看 100% 的网页。
目前我看到我的网页宽度的 60% 是纵向的。
我不想添加 JS 脚本或媒体查询。我的网页没有响应。
你有一个静态宽度,iPad在纵向模式下的宽度更小。在不调整静态宽度的情况下解决这个问题是不可能的。也许你仍然应该考虑 JS 或媒体查询。这是一个包含有关尺寸的更多信息的网站:http://www.websitedimensions.com/
我通过使用此代码实现了我的目标:
@media only screen
and (min-device-width: 768px)
and (max-device-width: 1024px)
and (orientation: portrait) {
body {
width: 768px;
}
}
显然它是 Ipad 的特定代码,但它也适用于 Nexus 9.0 和 Surface。
如果有人有 JS 脚本来做完全相同的事情,我有兴趣检查一下。