在CSS中设置移动页面缩放/缩放

时间:2012-09-13 22:40:24

标签: html css responsive-design

我正在为我无法更改标记或包含任何JS 的网站制作主题。我只能控制我主题的CSS,我只能在页面体内编写一些html。

我正在努力让这个主题响应,但我看不到如何在没有像这样的视口元标记的情况下控制手持设备上的初始缩放或页面缩放:

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

所以即使我可以通过CSS @media查询应用特定于移动设备的布局,该网站在手机上查看时也会缩小。在放大之前,文本和图像太小,放大后,布局太大,并且有一个水平滚动条。它在桌面上经过调整的浏览器窗口中看起来很完美;问题是手机浏览器会自动缩放页面。

所以我正在寻求解决方法。我目前有两条思路,我欢迎任何其他建议:

  1. 有没有办法单独使用CSS中的视口元标记?
  2. 我可以在移动专用样式中强制使用最大页面宽度,以便移动浏览器不会缩放页面吗?

1 个答案:

答案 0 :(得分:2)

@viewport,它可能对您有帮助。但支持很少。请查看此链接http://dev.opera.com/articles/view/an-introduction-to-meta-viewport-and-viewport/