html - 如何在导航栏中水平替换按钮

Question

我是编码新手。现在我正在尝试使用 Bootstrap 创建一个导航栏。但我不能水平放置按钮。我已经在每个元素中逐字尝试了 class="float-right" 。我尝试在 css 中使用 !important 进行 ovverride。再次没有回应。你能帮我怎么做吗？

提前谢谢你。

This is the code

Answer 1

如果您使用的是 Bootstrap 4，导航栏需要 navbar-expand-* 类之一才能使其水平，否则导航栏将是垂直/移动的(默认设置)。

此外，Bootstrap 4 中没有navbar-btn 类。只需使用btn btn-*。

<nav class="navbar navbar-light navbar-expand">
    <a class="navbar-brand" href="#">Brand</a>
    <ul class="navbar-nav">
        <li class="nav-item"><a href="#" class="nav-link">Home</a></li>
        <li class="nav-item"><a href="#" class="btn btn-primary">Btn</a></li>
        <li class="nav-item"><a href="#" class="nav-link">Link</a></li>
        <li class="nav-item"><a href="#" class="nav-link">Options</a></li>
    </ul>
</nav>

https://www.codeply.com/go/4mT9YOawzV