尝试获取布尔玛像素详细信息：下边框与文本宽度相同的标签

Question

我正在将Bulma.io用于我正在构建的某些前端，并希望达到像素细节级别。

我想知道是否可以对 TABS 组件进行一些scss编辑，以便用于将底部边框扩展到文本，而不是整个div，例如下图：

这是我的实际结果，在这里您可以注意到蓝线不仅覆盖文本，而且全部进入下一个TAB：

谢谢！

Answer 1

您可以使用：

.tabs li.is-active {
    padding-left: 1em;
    padding-right: 1em;
}
.tabs li.is-active a {
    padding-left: 0;
    padding-right: 0;
}

但是，由于布尔玛要求构造标签的方式，这样做也使得在活动标签内左右两边的区域不再可单击。这可能不是问题，因为相关标签是选定的标签，因此没有理由点击它。