最直接有效的方法是给该子项设置 margin-left: auto，因其在 Flex 布局中会吸收左侧剩余空间，将元素挤至容器最右；需确保它是 flex 容器的直系子元素且容器已设 display: flex。
想让 Flex 容器中的某个子项单独靠右对齐，最直接有效的方法就是给它设置 margin-left: auto。
为什么 margin-left: auto 能让它靠右？
在 Flex 布局中，自动外边距（auto margin）会吸收剩余的可用空间。当给某一项设置 margin-left: auto 时，浏览器会把该项左侧所有剩余空间“推”给这个 margin，从而把它“挤”到容器最右边。
使用时要注意什么？
- 该子项必须是 Flex 容器的**直系子元素**，否则不生效
- 容器需明确设置了 display: flex（或 inline-flex）
- 无需改动其他子项的样式，也不用改容器的 justify-content
- 如果同时设了 margin-right: auto，它会居中；只设 left 或 right 才实现单侧对齐
一个小例子
比如三个按钮排成一行，只想让第三个按钮靠右：
.btn-third { margin-left: auto; }
基本上就这些 —— 简单、干净、不用额外包装、也不影响布局流。
立即学习“前端免费学习笔记（深入）”；
