flex 项目的 flex 属性为什么只对横轴有效呢,为什么没有相应的纵轴属性呢?

2018-09-29 15:02:24 +08:00
 pinews
真诚请教,justify-content 可以让 flex 项目有相应的对齐方式,但我想模拟对齐效果,在原来的 flex 项目前后加入空白的项目,然后用 flex 属性控制,但是在纵轴上却无能为力,因为 flex 属性只对横轴有效,请问有没有较好的解决办法,因为用 flex 套 flex 的用法在一些情况下不太合适。谢谢。
3574 次点击
所在节点    设计
7 条回复
des
2018-09-29 15:31:16 +08:00
justify-content 设置主轴对齐
align-items 设置侧轴对齐

如果你想要嵌套 flex 的那种效果,请使用 grid 布局
binaryify
2018-09-29 15:51:59 +08:00
flex-direction: column
Jackliu
2018-09-29 16:01:23 +08:00
flex-direction
Edwards
2018-09-29 16:28:54 +08:00
你需要先确定主轴和交叉轴这个东西,
取决于 flex-direction。justify-content 指的是主轴方向的排布,align-item 指的是交叉轴上的排布
yggd
2018-09-29 16:39:48 +08:00
pinews
2018-09-29 17:01:47 +08:00
@binaryify
@Jackliu
@Edwards 横轴我已经用了,用了 flex-direction: column,原来的横轴就不能用了,结果是一样的。
pinews
2018-10-01 16:47:15 +08:00
@des 对齐我只是举例,我想说的是 flex,flex 方向默认是从左至右的,也可以先从上至下然后从左至右,请问 grid 怎么实现这个效果?

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/493850

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX