【问题标题】:Bootstrap 4-beta navbar-inverse and navbar-fixed-bottom not workingBootstrap 4-beta navbar-inverse 和 navbar-fixed-bottom 不起作用
【发布时间】:2018-03-28 02:32:27
【问题描述】:

我正在尝试在 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>

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

【问题讨论】:

  • 你能用sn-p输入你的代码吗

标签: html css asp.net twitter-bootstrap


【解决方案1】:

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

【讨论】:

    猜你喜欢
    • 2017-10-27
    • 2012-11-14
    • 1970-01-01
    • 2018-03-05
    • 2015-02-13
    • 2023-03-27
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多