css3盒模型新知识点(Fllexbox)

在工作中遇到了新的css3布局方法，突然觉得什么浮动和定位都弱爆了，一个好的前端工程师应该是页面中都没什么定位的，我只是菜鸟，有幸遇到一个前端大牛的主管。分享下自己掌握的内容。

Flexbox是布局模块，不是一个简单的属性，他包含父级元素和子元素的属性。

Flexbox主要是可以让你的布局根据浏览器的大小便不安进行自动伸缩。

创建Flex容器

Flexbox布局首先要创建一个父级元素，给父级元素设置上display：box

然后创建他的子集元素设置上flex

四个div平均水平分布的代码实例

水平或者垂直分布语法

box-orient定义分布的坐标轴：vertical和horizional。这两个值分别定义盒子垂直显示和水平显示：

.container{
  display: box;
  box-orient: horizontal;
}

box-orient: horizontal|vertical|inline-axis|block-axis|inherit;

今天就到这里，后期会一点点的补上这个盒模型的所有属性，我是菜鸟，慢慢成长。