Bootstrap 4 在響應時顯示導航鏈接

Question

我有一個功能齊全的導航欄。 我的問題是如何在頁面響應時顯示導航鏈接。 這是我的代碼供參考：

        <div class="collapse navbar-collapse w-100 order-1 order-lg-0" id="navbarNav">
            <ul class="nav navbar-nav ml-auto">
                <ul class="navbar-nav mr-auto mt2 mt-lg-0 text-uppercase">
                    <li class="nav-item">
                        <a class="nav-link" href="#">USD $ <i class="fa fa-angle-down" aria-hidden="true"></i></a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#">Cart (1)</a> <!-- This one must display at the right side of the navbar -->
                    </li>
                    <li class="nav-link" id="removeOnCollapse">
                        <a href=""><i class="fa fa-search mt-auto mx-3" style="color: black;"
                                aria-hidden="true"></i></a>
                    </li>
                </ul>
            </ul>
        </div>

這就是我想要的：

有什么辦法可以做到這一點嗎？

Answer 1

它很容易使用 bootstrap flex <div class="d-flex justify-content-between">...</div>

如需更多參考，請閱讀此處https://getbootstrap.com/docs/4.0/utilities/flex/