css - 如何证明单个 flexbox 元素(覆盖 justify-content)

Question

<分区>

Answer 1

似乎没有justify-self，但您可以通过将适当的margin设置为auto¹来实现类似的结果。例如对于 flex-direction: row(默认)，您应该设置 margin-right: auto 以使子项向左对齐。

.container {
  height: 100px;
  border: solid 10px skyblue;
  
  display: flex;
  justify-content: flex-end;
}
.block {
  width: 50px;
  background: tomato;
}
.justify-start {
  margin-right: auto;
}

<div class="container">
  <div class="block justify-start">justify-start</div>
  <div class="block"></div>
</div>

¹ 此行为是 defined by the Flexbox spec .