如何设计响应式网页计 第1篇
和视口元标签一起，你可以使用另外几个设定，但大体说来，上面那行就是你想要使用的。
你应该避免使用minimum-scale、maximum-scale，尤其是将user-scalable设为no。用户应该有权力尽可能大或小地进行缩放，阻止这种做法会引起访问性问题。
响应式设计指的是一个响应浏览环境的网页或者应用设计。它涵盖了很多 CSS 和 HTML 的功能和技术，现在基本上就是我们默认建设网站的方式。想一下你在手机上访问的网站，遇到一个缩放的桌面版网站，或者你需要向侧边滚动来寻找东西的网站可能是相当不寻常的。这是因为 Web 已经迁移到了这种响应式设计的方式上。
在这些课里学到的布局方式的帮助下，实现响应式设计也变得愈加简单。如果你今天新近了解 Web 开发，那么你与响应式设计早期相比，手边有多得多的工具。因而，你有必要检查下你所引用的任何材料的年纪。尽管历史上的文章仍然有用，现代的 CSS 和 HTML 的使用让创建一个优雅且实用的设计变得远远更加容易，且无论你的访客使用什么设备浏览网站。
如何设计响应式网页计 第2篇
这里有一个解决方法，它使用了calc()，如果你将vw单位加到了使用固定大小（例如em或者rem）的值组，那么文本仍然是可放缩的。基本来说，是vw加在了放缩后的值上。
这就是说，我们只需要指定标题的字体大小一次，而不是为移动端设定它，然后再在媒介查询中重新定义它。字体会在你增加视口大小的时候逐渐增大。
如何设计响应式网页计 第3篇
让我们按照以下方式添加基本的 HTML5 结构：
此部分的列划分是指网站线框图中显示的布局。因此，正如您从刚刚添加的代码中看到的那样，每个功能列表项都分配了medium-6列，因此每个项目的列宽将相等。
我们只是按照 Foundation 指南构建了网站内容和部分的 HTML 标记。我们还在途中添加了额外的类，以便稍后自定义 Foundation 默认样式。
自从构建 HTML 标记以来，我们还没有添加任何样式；此时的网站看起来是白色和简单的，如下面的屏幕截图所示：
我们刚刚添加的 HTML 的完整代码也可以在找到。
本章有效地开始了我们的第三个项目。在这个项目中，我们使用 Foundation 为一家初创公司构建网站。我们浏览了 Foundation 的特性，并将其中一些特性应用到了网站中。不过，本章中我们只添加了网站的 HTML 结构。此时的网站看起来仍然是白色和简单的。我们需要编写样式来定义网站的外观和感觉，这正是我们将在下一章中做的事情。
我们将使用 Sass 来编写网站样式，Sass 是 CSS 预处理器，也定义了 Foundation 基本样式。因此，在下一章的开始，我们将首先学习如何使用 Sass 变量、混合、函数和其他 Sass 特性，然后再编写网站样式。
看起来还有很多工作要做才能完成这个项目。因此，话不多说，让我们继续下一章吧。