前天花了一下午和一晚上做了一个关于第87届奥斯卡的专题页面: http://www.antzone.cn/topic-87thOscar.html
主要用 HTML+CSS 实现,因为 Discuz! 包含 DIY 功能,所以我直接把写好的代码嵌套进了 Discuz! 专题页面,这是背景介绍。现在详述我亟待解决的问题:
我在向朋友请教的时候,他建议我在 head 中添加以下 meta 信息:
<meta name="viewport" content="width=device-width, initial-scale=1">
添加完成后的显示效果是这样的:
http://i2.tietuku.com/112822d23c8f9e52s.jpg
而不添加的时候是这样的:
http://i2.tietuku.com/6e6f20f9406835ebs.jpg
我想要的是把下图所示的整体直接缩放然后在不同分辨率的设备上直接显示:
http://i2.tietuku.com/55b46a0a95331905.png
请前端高手指教,我想在不使用响应式设计的情况下,让这个页面直接缩放,网页中所有的模块位置和大小百分比均保持不变。请问怎么实现?谢谢。
这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。
V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。
V2EX is a community of developers, designers and creative people.