Find centralized, trusted content and collaborate around the technologies you use most.
Teams
Q&A for work
Connect and share knowledge within a single location that is structured and easy to search.
我对 flexbox 有点陌生。我希望能够采用三列布局并将这三列变成两行,当它们在浏览器中达到较小的宽度时。
例如:
Container Col 1 | Col 2 | Col 3
变成:
Container Col 1 | Col 3 Col 2
这可能吗?
是的,你可以做到,虽然它本身不是很“干净”。
使用媒体查询来更改列的弹性基础。因此,在较窄的宽度上,flex-basis 将为 %50,在较宽的宽度上为 33%。
然后使用 order 按您的意愿排列盒子。
看看:http ://codepen.io/anon/pen/LvIni