Question

由于我是font-end的新手，因此使用了带有角6的bootstrap4。我的col网格中有navtabs：

<div class="col-md-2 col-sm-2 col-xl-2 col-lg-2">
    <ul class="nav nav-tabs ">
        <li class="nav-item">
            <a class="nav-link">Menu 1</a>
        </li>
        <li class="nav-item">
            <a class="nav-link">Menu 2</a>
        </li>
        <li class="nav-item">
            <a class="nav-link">Menu 3</a>
        </li>
      </ul>
</div>

Image for the Above code

我只希望菜单标签的宽度在屏幕尺寸更改时自动适合引导栏内。你们能帮我这个忙吗？

预先感谢！

Answer 1

如果要更改列占用的空间，则必须根据窗口大小来调整每个列类。看来您使用的是小型设备，因此应添加xs列。并将大小配置为12，因为这是空间的100％。

<div class="col-xs-12 col-md-2 col-sm-2 col-xl-2 col-lg-2">
<ul class="nav nav-tabs">
    <li class="nav-item">
        <a class="nav-link">Menu 1</a>
    </li>
    <li class="nav-item">
        <a class="nav-link">Menu 2</a>
    </li>
    <li class="nav-item">
        <a class="nav-link">Menu 3</a>
    </li>
  </ul>

调整浏览器大小后，自动在引导程序4中适应navtab宽度

1 个答案: