split button 默认间距来自 .btn-group 的 margin-left: -1px 负边距实现无缝拼接；修改需覆盖该值并重置首按钮 margin-left: 0，否则整体右偏，且需适配 btn-sm/btn-lg 等尺寸类。
Split Button 默认间距来自哪里？
Bootstrap 的 btn-group 会把内部按钮（主按钮 + 下拉箭头按钮）紧贴排列，中间没有 margin 或 padding，靠的是 btn-group 自身的 display: inline-flex 和子元素的 margin-left: -1px 实现“无缝拼接”。这不是你漏写了 CSS，而是设计如此。
修改间距必须覆盖 margin-left: -1px
直接给子按钮加 margin 无效——会被父级 btn-group 的负边距抵消。真正要改的是那个 -1px 值。实操时建议用更具体的选择器避免全局污染：
.my-split-btn .btn-group > .btn {
margin-left: 4px; /* 替换掉 -1px */
}
.my-split-btn .btn-group > .btn:first-child {
margin-left: 0;
}
注意：必须同时重置第一个按钮的 margin-left，否则整个组会整体右偏。
响应式或不同尺寸下需单独处理
Bootstrap 的 btn-sm、btn-lg 会改变按钮高度，但默认不调整 margin-left。如果你用了尺寸类，得补上对应规则：
-
.my-split-btn .btn-group > .btn.btn-sm后加margin-left: 2px -
.my-split-btn .btn-group > .btn.btn-lg后加margin-left: 6px
不然小号按钮间隙显得过大，大号按钮又可能挤在一起。
用 Flex 布局替代 btn-group 更可控（但需放弃原生交互）
如果项目允许轻微改造结构，把 <div class="btn-group"> 换成 <code><div class="d-flex">，就能用标准 flex 属性控制间距：<pre class="brush:php;toolbar:false;"><div class="d-flex gap-2">
<button type="button" class="btn btn-primary">Action</button>
<button type="button" class="btn btn-outline-secondary dropdown-toggle dropdown-toggle-split" data-bs-toggle="dropdown"></button>
</div></pre>
<p>⚠️ 注意：<code>gap 在 IE 不支持；且 dropdown-toggle-split 的箭头位置和点击热区可能偏移，需要额外微调 padding 或 width。
真正麻烦的不是加几像素间距，而是负边距、尺寸类、响应式断点这三者叠加后，一处改，多处崩。动手前先在浏览器里 inspect 一下当前按钮的真实 computed margin 和父容器 display 类型。
