如何在整个选项卡栏上均匀分布选项卡

Question

我没有看到任何与此相关的文档，有谁知道如何实现这一点？我注意到 ant design 使用 rc-tabs，所以我查看了他们的文档，但也没有注意到任何东西，想也许我看起来不够仔细。如有任何帮助，我们将不胜感激。

Answer 1

覆盖以下

.ant-tabs

较少的规则为我解决了这个问题：

.ant-tabs {
  &-nav {
    display: flex;

    .ant-tabs-tab {
      flex-grow: 1;
      margin-right: 0px;
      width: 100%;
      text-align: center;
    }
  }
}

只要选项卡栏对于每个选项卡及其标题有足够的宽度，这将均匀地间隔所有选项卡，同时还消除每个选项卡之间的空白空间。

之前：

之后：

Answer 2

你可以尝试这样应用css

.ant-tabs-nav-list .ant-tabs-tab {
  width: 120px;
  justify-content: center;
}

.ant-tabs-ink-bar {
  height: 5px;
  background: #5a56e9 !important;
}