首先明确：IE9及以下版本不支持Flexbox。对于其他浏览器（包括所有移动端浏览器），有方法可以享受Flexbox的绝大多数特性，具体支持信息可以访问http://caniuse.com/进行查询。
如果把Flexbox新语法、旧语法和混合语法混合在一起使用，就可以让浏览器得到完美的展示。当然，在使用Flexbox时，应该考虑不同浏览器的私有属性，如Chrome要添加前缀-webkit-，Firefox要添加前缀-moz-等。
【示例】下面是一个例子，要设置Flexbox相关的3个属性和值。
.flex {
display: flex;
flex: 1;
justify-content: space-between;
}
这里使用了比较新的语法。但是，要想支持安卓浏览器（v4及以下版本操作系统）和IE10，最终代码得这样写：
.flex {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-flex: 1;
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
}
这些代码一个都不能少，因为每家浏览器厂商都有自己的前缀。例如，-ms-是Microsoft，-webkit-是WebKit，-moz-是Mozilla。于是，每个新特性要在所有浏览器中生效，就得写好几遍。首先是带各家厂商前缀的，最后一行才是W3C标准规定的。
这是让Flexbox跨浏览器的唯一有效方式。如今，虽然厂商很少再加前缀，但在可见的未来，仍然需要前缀来保证某些特性跨浏览器可用。
为了避免这种繁琐的操作，同时还能轻松准确地加上CSS前缀，用户可以使用Autoprefixer（https://github.com/postcss/autoprefixer）自动添加前缀。这是一个很快、准确而且安装简便的PostCSS插件。
Autoprefixer针对各种情况提供了很多版本，使用它甚至不需要命令行构建工具（Gulp或Grunt）。如果使用Sublime Text，有一个版本可以让你直接在Command Palette里选择使用它：https://github.com/sindresorhus/sublime-autoprefixer。此外还有针对Atom、Brackets和Visual Studio的版本。为了节省版面，我们在示例代码中可能会省略这些繁琐的前缀，仅给出W3C标准用法。