堆叠标签页下,列宽度怎么调


如图中红色线条所示,堆叠标签页下,这个列与列之间的宽度怎么调的窄一些。目前红色线条这个宽度有些占地方。想要更窄一点。
尝试了CSS调整,只有下列代码有点效果,但是又出新问题了。

/* 堆叠标签:缩窄“线与线之间”的列宽 */
:root {
  --stack-col-width: 48px; /* 改这里:比如 44px / 40px */
}

/* A. 通用强制:无论用 flex 还是 grid,都锁死 header 列宽 */
.workspace-tabs.mod-stacked .workspace-tab-header,
.workspace-tabs.mod-stacked .workspace-tab-header.is-active {
  flex: 0 0 var(--stack-col-width) !important;
  inline-size: var(--stack-col-width) !important;
  width: var(--stack-col-width) !important;
  min-width: var(--stack-col-width) !important;
  max-width: var(--stack-col-width) !important;
  margin-inline: 0 !important; /* 防止主题用 margin 撑宽 */
}

/* B. 若主题用变量控制(很多主题都有),一并覆盖 */
.workspace-tabs.mod-stacked {
  --tab-stacked-header-width: var(--stack-col-width) !important;
  --tab-width: var(--stack-col-width) !important;
}

标题栏宽度吗,可以试试直接用硬编码覆盖掉,或者干脆换个变量名。我试了几个主题,代码片段段的优先级都是更高的

官方文档:Tabs - Developer Documentation

body {
  --tab-stacked-header-width: 20px;
}

感谢大佬,推荐官文,之前一直不知道看这个哈哈

谢谢大佬,我大概找到怎么弄了