【1】
writing-mode 属性定义了文本在水平或垂直方向上如何排布。
【2】
box-sizing: border-box; //通过从已设定的宽度和高度分别减去边框和内边距才能得到内容的宽度和高度。
【3】
display: flex;
justify-content: space-between; //位于各行之间留有空白的容器内
【4】
flex-wrap 属性规定flex容器是单行或者多行，同时横轴的方向决定了新行堆叠的方向。
flex-wrap : wrap. 让弹性盒元素在必要的时候拆行
【5】
【6】
transition: 0.2s;//设置元素宽度的显示效果,完成过渡效果需要多少秒
【7】
避免文本溢出的解决办法：
-webkit-line-clamp: 1; //
-webkit-box-orient: vertical;
display: -webkit-box;
转： https://www.cnblogs.com/liangcheng11/p/5120546.html（5种方法解决文本溢出）