写法 .list { display: flex; gap: 12px }，子项之间自动获得 12px 间距，首尾两端没有多余间隙。grid 里还可分别写 column-gap / row-gap。它的杀手锏是「只管之间、不管两端」——不再需要 :not(:last-child) 的负 margin 杂技。
需注意 gap 作用在容器上、计算进容器宽度，子项若用百分比宽度要记得把 gap 也算进去。Safari 14.1 之前不支持 flex 的 gap，做兼容时查一眼 caniuse。
<style> .row { display: flex; gap: 10px; padding: 12px; background: #161b22; border-radius: 8px; flex-wrap: wrap; } .item { flex: 1; min-width: 90px; padding: 10px 0; text-align: center; color: #e6edf3; background: #21262d; border-radius: 6px; } </style> <div class="row"> <div class="item">1</div><div class="item">2</div><div class="item">3</div><div class="item">4</div> </div>