哎，不想吐槽自己了，表示已远远落后，从今天起开始恶补吧，来一个实例
<html>
<head>
<meta name="generator"
content="HTML Tidy for HTML5 (experimental) for Windows https://github.com/w3c/tidy-html5/tree/c63cc39" />
<title></title>
<style>
*{
margin:0px;
padding:0px;
}
.test{
width:700px;
height:200px;
display:-moz-box;
display:-webkit-box;
display:box;
}
.test div{
background:green;
margin-right:20px;
}
.test div:first-child{
-moz-box-flex:2;
-webkit-box-flex:2;
}
.test div:nth-child(2){
-moz-box-flex:3;
-webkit-box-flex:3;
}
.test div:nth-child(3){
-moz-box-flex:3;
-webkit-box-flex:3;
}
</style>
</head>
<body>
<div class="test">
<div></div>
<div></div>
<div></div>
</div>
</body>
</html>
原文：http://www.cnblogs.com/benchan2015/p/4743326.html