6

我一直在研究我的第一个响应式设计，但在我的 iPhone 上查看它时遇到了一些问题。当我在 iPhone 上打开一个页面时，它向左放大了一点——刚好错过了最右边的文本。

您可以在此处找到该网站。viewport-meta 标签如下所示：

<meta name="viewport" content="width=device-width; initial-scale=1.0;" />

在我的电脑和 iPad 上看起来都不错。任何和所有的帮助表示赞赏。

4

4 回答 4

14

试试这个视口，它在我的网站上效果很好：

<meta name="viewport" content="initial-scale=1, maximum-scale=1">
于 2012-04-18T22:54:55.857 回答
1

找到了。我在 .wrapper 元素下放置了width:100%;and 。将其更改为and ，它就像一个魅力。padding:0 10px;@media only screen and (max-width: 600px)width:96%padding: 0 2%;

谢谢您的帮助！

于 2012-04-19T11:49:58.877 回答
1

看看你是否100vh在任何地方使用你的 CSS。如果您使用100vh它，则将菜单栏和底部工具栏视为100vh. 见https://chanind.github.io/javascript/2019/09/28/avoid-100vh-on-mobile-web.html

于 2020-03-02T15:23:34.927 回答
0

尝试同时添加width:100%; overflow:hidden;和body元素html。如果您的页面加载不同，那肯定是 CSS 问题。

于 2017-10-03T12:18:52.630 回答