采用Flex布局的元素，称为Flex容器container。它的所有子元素自动成为容器成员，称为Flex项目item。 容器中默认存在两条轴，主轴(main axis) 和交叉轴(cross axis)。项目默认沿主轴排列。单个项目占据的主轴空间叫做main size，占据的交…

网页布局（layout）是CSS的一个重点应用。 布局的传统解决方案，基于盒状模型，依赖 display属性 + position属性 +float属性。针对于某些特殊布局就显得非常不方便，例如，垂直居中就不容易实现。 2009年，W3C提出了一种新的方案—-Flex布局，可以…

Flex 是 Flexible Box 的缩写，意为"弹性布局"，用来为盒状模型提供最大的灵活性。 Webkit 内核的浏览器，必须加上-webkit前缀。 采用 Flex 布局的元素，称为 Flex 容器（flex container），简称"容器"。它的所有子元素自动成为容…

Flex 是 Flexible Box 的缩写，意为"弹性布局"，用来为盒状模型提供最大的灵活性。 设为 Flex 布局以后，子元素的float、clear和vertical-align属性将失效。 1. flex-direction 项目的排列方向 2. flex-wrap …

定义子项目分配剩余空间，用flex表示占多少份。 允许单个项目有与其他项目不一样的对齐方式，可覆盖align-items属性。 响应式需要一个父级作为布局容器，来配合子元素实现变化效果。在不同屏幕下，通过媒体查询来改变布局容器的大小，再改变子元素的布局方式和大小。