Flex containers are not block containers, and so some properties that were designed with the assumption of block layout don’t apply in the context of flex layout. In particular:
the column-* properties in the Multi-column Layout module [CSS3COL] have no effect on a flex container.
float and clear do not create floating or clearance of flex item, and do not take it out-of-flow.
vertical-align has no effect on a flex item.
the ::first-line and ::first-letter pseudo-elements do not apply to first letter to their ancestors.
If an element’s specified display is
用于块状元素的属性对flex 容器不起作用
Flex 容器不是块级容器，因此一些专用于块状布局的属性，对Flex 布局不起作用。比如：
2. float 和 clear 不能让弹性容器下的项目摆脱文档流，或清除浮动。
3. vertical-align 垂直居中不起作用。（flex布局下，垂直居中更简单舒适：看我这里的一篇文章）
4. 伪类元素 ::first-line 和 ::first-letter
flex container box.
flex container box.
flex，inline-flex，inline-block 区别
flex： 将对象作为块级弹性伸缩盒显示。
inline-flex：将对象作为内联弹性伸缩盒显示。
inline-block: 将对象呈现为inline对象，但是对象的内容作为block对象呈现。
比如说，inline元素的margin和padding属性，水平方向的padding-left, padding-right, margin-left, margin-right都产生边距效果；但竖直方向的padding-top, padding-bottom, margin-top, margin-bottom不会产生边距效果。
那么，对于inline-block来说，margin和padding的垂直方向的边距，则会产生边距效果。
Note: Some values of display normally trigger the creation of anonymous boxes around the original box. If such a box is a flex items, instead of being wrapped into a single anonymous table.
display的一些值，很可能在该容器触发创建匿名框机制。（匿名框有块级的，和内联的。）
如果是一个弹性容器的伸缩项目，它首先被块级化，因此不会创建匿名框。比如，两个相邻的伸缩项目，display值为 table-cell时，是两个独立的块级项目，而不会包裹成一个单独的匿名表格。