flex-direction

　　

　　flex-direction 属性指定了弹性子元素在父容器中的位置。

　　

　　语法

　　

　　flex-direction: row | row-reverse | column | column-reverse

　　

　　flex-direction的值有:

　　

　　row：横向从左到右排列（左对齐），默认的排列方式。

　　

　　row-reverse：反转横向排列（右对齐，从后往前排，最后一项排在最前面。

　　

　　column：纵向排列。

　　

　　column-reverse：反转纵向排列，从后往前排，最后一项排在最上面。

　　

　　以下实例演示了 row-reverse 的使用:

　　

　　实例

　　

　　.flex-container {

　　

　　display: -webkit-flex;

　　

　　display: flex;

　　

　　-webkit-flex-direction: row-reverse;

　　

　　flex-direction: row-reverse;

　　

　　width: 400px;

　　

　　height: 250px;

　　

　　background-color: lightgrey;

　　

　　}