Question

我的导航栏有问题：如果我使用引导程序中的stylesheet链接

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">

我的导航栏形式如下：您至少需要10个信誉才能发布图片，因此我必须这样发布：https://i.imgur.com/dANnzzG.png

在每个routerLink上。

我的导航栏组件看起来像这样：


        <nav class="navbar navbar-default">
            <ul class="nav navbar-nav">
                    <li>
                            <a routerLinkActive="active" routerLink="">Home</a>
                        </li>
                <li>
                    <a routerLinkActive="active" routerLink="list">List</a>
                </li>
                <li>
                    <a routerLinkActive="active" routerLink="create">Create</a>
                </li>
                <li>
                    <a routerLinkActive="active" routerLink="calendar">Calendar</a>
                </li>
            </ul>
        </nav>
        <div>
        <section>
        <router-outlet></router-outlet>
    </section>
    </div>

我该如何解决？谢谢！

Answer 1

你可以这样写。

<section class="sidebar">
<div class="collapse navbar-collapse m-0 ad-user sidebar-form" id="navbar-collapse">
            <ul class="nav navbar-nav">             
                <li class="dropdown user user-menu">
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                        <div id="profile_view_image"></div>
                        <span class="hidden-xs">{{ data }}</span>
                    </a>
                    <ul class="dropdown-menu" style="width: 160px; !important">
                        <li><a href="{{ route('page') }}"><i class="fa fa-user"></i> </a></li>
                        <li><a href="{{ route('page2') }}"><i class="fa fa-key"></i> </a></li>
                        <form id="logout-form" action="{{ route('page') }}" method="POST" style="display: none;">
                        </form> -->
                    </ul>
                </li>
            </ul>
        </div>
</section>

如果我使用Bootstrap链接，则我的Bootstrap Nav栏形如表格

1 个答案: