display:flex（注意：所有相关属性都需要加-webkit-前缀）

#website ul:first-child {
    display:-webkit-box;
    box-pack:justify;
    -webkit-box-pack: justify;

    display:flex;
    display:-webkit-flex;
    justify-content: space-between;
    -webkit-justify-content: space-between;
}

对于支持flex的布局，绿色代码会进行重置，最终显示绿色代码 效果；
对于不支持flex的浏览器，执行蓝色代码，绿色代码被忽略，最终显示 蓝色代码效果。

注意：li中要加上clearfix类，清除 垂直方向外边距重合。（不支持flex布局的浏览器，li设置的margin-top无效）

伸缩盒布局堪称布局神器，有过3次演变历史：
　　09：box
　　11:flexbox
　　12:flex
box基本所有浏览器都支持，但是似乎已经淘汰。
flex是目前最新的属性。


另外，对于伸缩盒布局中元素自动换行，
flex布局可以添加属性：
　　　　flex-wrap:wrap;
　　　　-webkit-flex-wrap: wrap;
box布局可以添加属性：
　　　　box-lines: multiple;
　　　　-webkit-box-lines: multiple;
　　　但是这两个属性所有老版本浏览器都不支持。
所以，涉及到换行，直接写到两个布局容器里，避免用到换行属性。