问题

最近在学习 bootstrap3 的过程中，运行 grunt 总是在终端输出 warning: fallback background-color (hexo or rgb) should precede…的警告提示。网上搜了问题，终于找到了答案，其中一篇文章对这个问题的阐述比较清楚，链接如下：

http://github.com/CSSLint/csslint/wiki/Require-fallback-colors

这篇文章的大概意思就是说，旧的浏览器只支持 hex 或者 rgb 格式的 color，但是后来 CSS3 新增了一些 color 的格式，比如 rgba(), hsl(), hsla()等等，这些浏览器不支持这种格式的 color 怎么办。我们就需要添加一个 fallback (background-)color，例如，本来我们的样式是：

.box {
  background: #000;
  color: rgba(100, 100, 200, 0.5);
}

但是因为老式浏览器不支持 rgba() 的写法，所以，我们需要把上面的 CSS 样式修改为：

.box {
  background: #000;
  color: blue;
  color: rgba(100, 100, 200, 0.5)
}

而这个 fallback (background-)color 应该永远放在 CSS3 新的 color 样式写法的前面。这样的话，现代浏览器就会通过解析后面的样式进而覆盖前面的样式，实现新样式的应用。而老式浏览器则因为无法立即新样式的写法，所以只解析到 fallback (background-)color，再往下解析就因为无法理解而放弃。