HTML5实践 -
<div id="cnblogs_post_body"> 转载请注明原创地址:http://www.cnblogs.com/softlover/archive/2012/11/25/2787559.html响应式web设计现在已经不是一个难事了,如果你还不熟悉他,可以参看我的文章《HTML5实践 -- 流式响应式设计》。如果你是一个初学者,可能响应式设计对你来说有点发杂,但实际上他比你想象的要简单的多。为了方便你更快的学习响应式设计,我特意写了这个教程,通过简单的三个步骤你就能掌握响应式设计的基本逻辑和media queries(假设你掌握css知识)。
demo预览地址:http://webdesignerwall.com/demo/responsive-design/index.html
步骤 1. Meta标签
大多数mobile浏览器,会将页面的宽度调整至viewport宽度,用以适应屏幕显示。这里我们会使用到viewport标签,例如下面的语句将添加在<head>之间,告诉浏览器使用设备的宽度作为viewport的宽度,取消initial scale的功能。
<div class="cnblogs_code"><meta name="viewport" content="width=device-width, initial-scale=1.0">
页:
[1]