flex知识点精炼

原文链接： https://www.mk2048.com/blog/blog.php?id=h0j2khkch0hj&title=flex%E7%9F%A5%E8%AF%86%E7%82%B9%E7%B2%BE%E7%82%BC

1. 原址：http://www.runoob.com/w3cnote/flex-grammar.html

　　容器的属性

1. 设置Flex布局之后，子元素的float、clear、vertical align将失效。
2. 任何一个容器都可以指定为flex布局。行内元素也可以使用flex布局，webkit内核的浏览器，必须加上-webkit前缀。
3. flex-wrap属性默认的是不换行。
4. flex-flow属性是flex-direction属性和flex-wrap属性的简写形式，默认是row nowrap。
5. align-items属性的默认值是stretch：如果项目未设置高度或者为auto，将占满整个容器的高度。（aligin-content的默认属性也是stretch）
6. align-content属性定义了多跟轴线的对其方式。如果项目只有一根轴线，该属性不起作用。

　　项目的属性

1. order属性定义项目的排列顺序。数值越小排列越靠前默认为0。
2. flex-grow的属性默认为0，flex-shrink的属性默认为1。它们两个都不能为负。
3. flex-shrink的值越大，减小的越厉害。如果值为0，表示不减小
4. flex属性：flex属性是flex-grow、flex-shrink、flex-basis的简写，默认值为0 1 auto。后两个属性可选。该属性有两个快捷键——auto（1 1 auto）none（0 0 auto）。建议优先使用这个属性，而不是单独写三个分离的属性，因为浏览器会推算相关值。

更多专业前端知识，请上 【猿2048】www.mk2048.com