flex布局中,是通过在容器上设置justify-content
属性来规定子元素在容器中主轴上的排列方式
而如果要单独设置子元素的排列方式,则可以通过子元素的margin
属性实现,例如:
.container {
display: flex;
justify-content: space-between;
}
.item2 {
margin-left: 10px;
margin-right: auto;
}
就实现了container下item2子元素单独靠左排列(且距离左侧10px),其他子元素间隔排列
同理,设置margin-left: auto; margin-right: 0;
,就可实现子元素单独靠右排列(且距离右侧0px)