在上一篇文章中，我阐述了在响应式设计中处理图像3种方案的观点，讨论了最好的解决方案,采用合适图像尺寸服务于各种尺寸的屏幕。那么，本文接下来将从另外一个角度来聊管理图像，那就是跨浏览器的兼容性。在整个网页开发过程中，尤其你想创造一个响应式的结构——一个web开发人员必须去面对一个最重要及最频繁的问题就是兼容各种浏览器。

这是《Understanding Responsive Web Design》系列教程中的第五篇。本文中，我将展示当一个web开发人员在创建响应式网站时都会遇到的典型问题：对图像的处理。或许你已知道，移动终端开发者面临的挑战是多不胜数的，使得图像适应多种屏幕尺寸无疑是最大的困难之一。现在有三种方案可供开发人员去选择开发响应式图像：与浏览器‘对抗’、放弃它、或者依赖服务器。接下来，我们去了解每种方案的优点与缺点。

在前面的文章中，我已介绍了“流布局”的特性和描述了如何使用响应式字体。在本文中，我将介绍一种应用广泛及非常著名的网格布局。网格系统其实早已应用在印刷媒体上，只是在web和mobile上的应用才发展一段时间。

Sass的数据类型可以说是一个大家庭了，其数据类型中的数字、字符串、列表、颜色和布尔型，涵盖了大多数我们的需求。但是，正如一个框架开始的演变，在这个数据类型中还缺少一个关键性的工具：关联数组。

Sass的控制命令是创建库和重复使用代码库的一个基础，使用好Sass，需要掌握好Sass的控制命令，只有掌握了这些，你才能进入Sass的下一个层次的学习。

网页字体图标到现在来说并不是一个新话题，大家都知道是通过@font-face来实现的。虽然有很多地方介绍如何制作属于自己的网页字体图标，但大部分都还是需要收费。让你我们这等屌丝无法接受。除了这些之外，其实还有一些制作矢量图的软件可以实现自己的图标。在这篇译文中，就详细介绍了如何使用Inkscape软件制作出自己的网页字体图标。

在CSS中没有逻辑的概念，所以很多程序员不太喜欢。而在CSS的预处理器语言中植入了类似程序语言的功能。比如说一些指令“@if”、“@for”、“@each”、"@while"等。而在Sass中也同样具有这些指令。借助这些指令可以让你编译出比"@extend"和"@mixin"更精简的CSS。那么在这篇文章中主要用来帮助一些从未接过这些指令的同学有所帮助和了解。

前两篇文章中关注响应式web设计的清晰概念和如何响应式地使用字体之后，让我们来深人研究一下流布局。在此文中，我将演示当下是真正需要流布局的，以及当你可以选择不一定是响应式的不同解决方案。让我们接下来学习一些特定技术与应用。理解灵活的布局对你的项目很有帮助，理解和考虑到其他可行的解决方案是否是一种很好的选择。事实上，只有深入了解每种方案的优缺点，你才能有效地选择某种布局方案。布局类型有4种：固定宽度布局，流体布局，弹性布局和混合布局，一起来逐个分析吧。

多次被问及Sass在项目中运用的时候要如何管理自己的文件？或许每个人都有各自的想法，也略有不同，也有各自的经验。今天根据Hugo Giraudel的《Architecture for a Sass Project》一文所译，向大家介绍了如何在Sass项目中管理自己的文件。主要目的是告诉大家怎么去想，并不是告诉大怎么做。我想这一点更切合实际。

Sass中提供多种方法来共用相同的CSS代码。你可以使用@include定义好的@mixin在你的CSS样式中插入新的CSS样式，你也可以使用@extend定义好的CSS类选择器，向你的CSS样式中插入新的CSS样式。在Sass3.2中引入了一个新的特性——选择器占位符“%placeholder”，能过@extend可以得到更有效的输出。