第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全,請(qǐng)及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問(wèn)題,去搜搜看,總會(huì)有你想問(wèn)的

無(wú)法使用 Bootstrap 4 對(duì)齊正確的導(dǎo)航項(xiàng)以顯示在響應(yīng)式視圖中

無(wú)法使用 Bootstrap 4 對(duì)齊正確的導(dǎo)航項(xiàng)以顯示在響應(yīng)式視圖中

qq_花開(kāi)花謝_0 2023-12-04 16:58:49
我已經(jīng)嘗試解決這個(gè)問(wèn)題有一段時(shí)間了。當(dāng)談到 Bootstrap 時(shí),我有點(diǎn)菜鳥(niǎo),所以請(qǐng)?jiān)试S我回答一個(gè)可能簡(jiǎn)單的問(wèn)題。我正在嘗試使用 bootstrap 4 創(chuàng)建一個(gè)導(dǎo)航欄,大部分菜單項(xiàng)位于左側(cè),但登錄按鈕位于右側(cè)。我想出了一些迂回的方法(這可能是錯(cuò)誤的),但是每當(dāng)我在手機(jī)或平板電腦視圖中查看頁(yè)面時(shí),當(dāng)單擊漢堡菜單圖標(biāo)時(shí),菜單的“登錄”項(xiàng)不會(huì)出現(xiàn)。它出現(xiàn)到一定程度(認(rèn)為大約為 760 像素),然后就從視圖中消失。這是到目前為止的標(biāo)記,如有任何幫助,我們將不勝感激。        <a class="navbar-brand" href="#"><img src="imgs/branding/nerve logo_small.png" width="50" height="50" alt=""></a>            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">            <span class="navbar-toggler-icon"></span>            </button>        <div class="collapse navbar-collapse" id="navbarNav">            <ul class="navbar-nav">              <li class="nav-item active">                <a class="nav-link" href="index.php">Home <span class="sr-only">(current)</span></a>              </li>              <li class="nav-item">                <a class="nav-link" href="#">Features</a>              </li>              <li class="nav-item">                <a class="nav-link" href="#">Placeholder 1</a>              </li>              <li class="nav-item">                <a class="nav-link" href="#">Placeholder 2</a>              </li>              <li class="nav-item">                <a class="nav-link" href="#">Placeholder 3</a>              </li>              <li class="nav-item">                <a class="nav-link" href="#">Placeholder 4</a>              </li>            </ul>             </div>           <ul class="navbar-nav flex-row ml-md-auto d-none d-md-flex">                 <li class="nav-item text-right">                    <a class="nav-link " href="#">Login</a>                </li>            </ul>        </nav>
查看完整描述

1 回答

?
達(dá)令說(shuō)

TA貢獻(xiàn)1821條經(jīng)驗(yàn) 獲得超6個(gè)贊

我想,問(wèn)題就在這里


<ul class="navbar-nav flex-row ml-md-auto d-none d-md-flex"> 

                <li class="nav-item text-right">

                    <a class="nav-link " href="#">Login</a>

                </li>

            </ul>

d-none d-md-flex - 這部分意味著,該元素將被隱藏(d-none)直到768px(d- md -flex),然后將顯示為flex。嘗試刪除d-none


更新


最好的方法是刪除獨(dú)立的登錄 ul 并將登錄添加為全局 ul 列表的一部分。


<ul class="navbar-nav w-100">

    <li class="nav-item active">

      <a class="nav-link" href="index.php">Home <span class="sr-only">(current)</span></a>

    </li>

    <li class="nav-item">

      <a class="nav-link" href="#">Features</a>

    </li>

    <li class="nav-item">

      <a class="nav-link" href="#">Placeholder 1</a>

    </li>

    <li class="nav-item">

      <a class="nav-link" href="#">Placeholder 2</a>

    </li>

    <li class="nav-item">

      <a class="nav-link" href="#">Placeholder 3</a>

    </li>

    <li class="nav-item">

      <a class="nav-link" href="#">Placeholder 4</a>

    </li>

    <li class="nav-item flex-sm-grow-1 text-sm-right">

        <a class="nav-link " href="#">Login</a>

    </li>

  </ul> 

仔細(xì)查看Login li 中的flex-sm-grow-1 text-sm-right。并且不要忘記將w-100添加到 ul。


查看完整回答
反對(duì) 回復(fù) 2023-12-04
  • 1 回答
  • 0 關(guān)注
  • 148 瀏覽

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購(gòu)課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)