【问题标题】:How to center tabs with ngx-bootstrap如何使用 ngx-bootstrap 使标签居中
【发布时间】:2019-11-20 04:50:43
【问题描述】:

默认情况下,选项卡显示在左侧,但您希望它们显示在中间。
我想做以下事情。

<div>
  <tabset class="justify-content-center">
    <tab heading="Basic title" id="tab1">Basic content</tab>
    <tab heading="Basic Title 1">Basic content 1</tab>
    <tab heading="Basic Title 2">Basic content 2</tab>
  </tabset>
</div>

我看了标签页,但是好像不支持中心视图,怎么办?
https://valor-software.com/ngx-bootstrap/#/tabs

我尝试在 styles.scss 中执行以下操作,但出现构建错误。

tabset ul {
  @extend .justify-content-center;
}

"ngx-bootstrap": "^5.2.0"

【问题讨论】:

    标签: ngx-bootstrap


    【解决方案1】:

    通过这样设置 css,我们能够实现我们想要做的事情。


    scss

    .tabset-justify-content-center {
        .nav-tabs {
          @extend .justify-content-center;
      }
    }
    
    @import '../node_modules/bootstrap/scss/bootstrap';
    

    html

    <tabset class="tabset-justify-content-center">
    

    【讨论】:

      猜你喜欢
      • 2018-04-04
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2013-07-15
      • 2017-12-23
      • 1970-01-01
      • 1970-01-01
      • 2015-09-24
      相关资源
      最近更新 更多