div横向排列

转自：https://blog.csdn.net/zmhawk/article/details/73293366#t2

仅做个人笔记

---

所有途径

最佳途径（其他略）

---

【第一行】

 给父元素设置 display: flex;

---

【第二行】

通过 justify-content 属性调整子元素的水平对齐方式：

1. flex-start：

    默认

2. flex-end：

 3. center：

4. space-around：

5. space-between：

---

【第三行】

但是当父元素宽度不够时， flex 默认是不会换行的，而是会等比例压缩，缩放比例 flex-shrink 属性或复合属性 flex 相关。

通过 flex-wrap 属性可以使其换行，该值有三个取值 nowrap、 wrap、 wrap-reverse，默认为 nowrap。

1. nowrap

默认，图略。

2. wrap

3. wrap-reverse