响应式 Web 设计

• 定义：响应式Web设计，就是网页内容会随着访问它的视口及设备的不同而呈现不同的样式。

浏览器支持

• 浏览器支持一直是响应式Web设计面临的最大问题。主要是时间问题和预算问题。

• 在确定哪些平台和浏览器版本支持什么特性时，建议参考这个网站：http://caniuse.com。这个网站的界面简洁，查询方便。

• 把时间和资源主要放在支持现代浏览器和现代平台上才是最明智的。

• 举例来说：如果支持浏览器X的开发成本超过了浏览器X的用户创造的收益，那么就不为该浏览器开发特殊的版本。

工具和文本编辑器

• 工具可以把需要手工来做的事自动化。比如，CSS预处理器（Sass、LESS、Stylus、PostCSS）可以帮我们组织代码、变量、颜色操作和数学运算。像PostCSS可以帮我们完成添加浏览器前缀这样烦琐的任务。另外，一些清理和验证工具可以帮我们检查HTML、CSS和JavaScript代码是否符合标准，自动提示输入错误和语法错误。

HTML

• 定义：即超文本标记语言。超文本就是指页面内可以包含图片、链接，甚至音乐、程序等非文字元素。

• 超文本标记语言的结构包括“头”部分（英语：Head）、和“主体”部分（英语：Body），其中“头”部提供关于网页的信息，“主体”部分提供网页的具体内容。

• max-width规则，就是要保证所有图片最大显示为其自身的100%（即最大只可以显示为自身那么大）。此时，如果包含图片的元素（比如包含图片的body或div）比图片固有宽度小，图片会缩放占满最大可用空间。

媒体查询

媒体查询允许作者测试和用户代理的查询值或特征或显示设备,独立文档的呈现。 它们用于CSS @media规则条件样式应用于文档,和各种其他上下文和语言,如HTML和JavaScript。

• 所谓“断点”，就是某个宽度临界点，跨过这个点布局就会发生显著变化。

• 基本上所有浏览器默认的文本大小都是16像素，因此用像素值除以16就可以得到rem值。