现在用户浏览网页的设备越来越复杂，大尺寸的电脑屏幕，平板，智能手机等等 … 以前我们只针对大尺寸屏幕做设计，已经不在适合现在的情况了。

我们需要让设计在不同尺寸的设备上做出不同的响应 … 让用户不管使用什么样的设备来访问我们的网站，都有一个很好的体验。

这就是响应式的设计 … 英文是 Responsive Web Design … 可以简称为 RWD …

内容

这个课程的开始，我们先了解一下什么是响应式的设计，学习几个真正的响应式设计的网站 ....

再了解几个基本的概念 ... 比如 viewport 可视窗口 ，什么是 viewport ... 为什么会有 viewport ，还有怎么样去手工的设置这个 viewport ...

然后我们会去学习响应式设计里最重要的 media query，媒体查询 .... 在页面上应用 media query 的方法 ...

了解几个 media query 媒体特性 ... 比如去判断设备的宽度，高度 ... 可视窗口的宽度，高度，还有设备的使用方向 .... 分辨率等等 .....

我们还要学习使用操作符来创建复杂的媒体查询 ....

然后我们会去创建响应式的页面布局 .... 去创建切换式的响应式导航菜单 ......

再学习几个响应式图像的方法 .... 我们会根据可视窗口的宽度，还有设备的像素密度来加载使用不同的图像 ....

最后，我们会去制作一个可以使用手指控制的幻灯片 ....

下面，我们就开始这个响应式设计的课程。