html - Bootstrap 4-beta navbar-inverse 和 navbar-fixed-bottom 不工作

Question

我正在尝试在 ASP.NETCore Web 应用程序中使用 Bootstrap 4-beta 设置导航栏和页脚，但 Bootstrap 的导航栏无法正常工作我使用了 navbar-inverse 和 navbar-dark 但问题是一样的，我也在尝试使用 navbar 和 navbar-fixed-bottom 设置页脚，但页脚不在页面底部。我是 Bootstrap 和 ASP.NET MVC 的新手。

HTML

<div id="wrapper">
    <nav class="navbar navbar-inverse">
        <div class="container-fluid" style="display:flex; justify-content:flex-end; align-items:center;">
            <ul class="nav navbar-nav">
                <li>
                    <button id="sidebarToggle" class="btn btn-primary">
                        <i class="fa fa-angle-double-left"></i>
                    </button>
                </li>
            </ul>
            <a asp-controller="App" asp-action="Index" class="navbar-brand mr-auto" style="color:cornflowerblue">
            The World
            </a>
            <ul class="nav navbar-nav">
                <li>
                    <a href="#" class="btn btn-sm btn-info">
                        <i class="fa fa-save"></i>Save
                    </a>
                </li>
                </ul>
            <ul class="nav navbar-nav">
                <li>
                    <a href="#" class="btn btn-sm btn-info">
                        <i class="fa fa-print"></i>Print
                    </a>
                </li>
            </ul>
        </div>
    </nav>

    <div id="main" class="container-fluid">
        <div>
            @RenderBody() 
        </div>
    </div>

    <div id="footer" class="container-fluid">
        <footer>
            <div  class="navbar navbar-fixed-bottom">
                <h4 class="text-center text-primary">Copyright &copy; 2017</h4>
            </div>
        </footer>
    </div>
</div>

结果: 我做错了什么？谢谢!

Answer 1

因为在 Bootstrap 4 中，他们将 .navbar-fixed-bottom 更改为 .fixed-bottom