iOS Mobile Safari 纵向布局缩放过度

发布于 2024-11-17 08:15:51 字数 617 浏览 2 评论 0原文

我希望在 ipad 和 iphone 上使用 mobile safari 让我的网站看起来完美。目前，某些页面上的所有内容在横向上看起来都很棒，但如果您将设备更改为纵向，整个网站都会放大。我正在使用移动特定样式，但如何解决此问题？

不起作用的页面：www.zedsaid.com/apps

起作用的页面：www.zedsaid.com/blog

CSS：

/* iPhone */
@media only screen and (max-device-width: 481px) {
#header {
  width:860px!important;
}
}

/* iPad */
@media only screen and (max-device-width: 768px) {
#header {
  width:860px!important;
}
}

我只是不确定为什么我的某些页面（博客）可以正确缩放，但其他页面可以正确缩放（应用程序、联系方式）不要！

原文

I would like to have my website look perfect using mobile safari on both the ipad and iphone. Currently everything looks great in landscape on some pages, but if you change the device to portrait, the whole site gets zoomed in. I am using mobile specific styles, but how can I fix this problem?

Page that doesn't work: www.zedsaid.com/apps

Page that DOES work: www.zedsaid.com/blog

CSS:

/* iPhone */
@media only screen and (max-device-width: 481px) {
#header {
  width:860px!important;
}
}

/* iPad */
@media only screen and (max-device-width: 768px) {
#header {
  width:860px!important;
}
}

I am just not sure why some of my pages scale correctly (blog) but other pages (apps, contact) do not!

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

樱娆 2024-11-24 08:15:51

试试这个：

body * {
-webkit-text-size-adjust: none !important;
}

或者：

/* iPhone */
@media only screen and (max-device-width: 481px) {
#header {
  width: 860px;
  -webkit-text-size-adjust: none;
}
}

/* iPad */
@media only screen and (max-device-width: 768px) {
#header {
  width: 860px;
  -webkit-text-size-adjust: none;
}
}

Try this:

body * {
-webkit-text-size-adjust: none !important;
}

or:

/* iPhone */
@media only screen and (max-device-width: 481px) {
#header {
  width: 860px;
  -webkit-text-size-adjust: none;
}
}

/* iPad */
@media only screen and (max-device-width: 768px) {
#header {
  width: 860px;
  -webkit-text-size-adjust: none;
}
}

回复收藏 0 原文

~没有更多了~