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

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

如何將導(dǎo)航項(xiàng)與導(dǎo)航欄中的右側(cè)對齊？

如何將導(dǎo)航項(xiàng)與導(dǎo)航欄中的右側(cè)對齊？

Go
繁星點(diǎn)點(diǎn)滴滴 2023-08-21 16:17:57
如何將導(dǎo)航項(xiàng)對齊到特定位置？我希望我的品牌名稱位于導(dǎo)航欄的左側(cè)，登錄按鈕位于導(dǎo)航欄的右端，我是引導(dǎo)程序新手，請幫助我解決這個(gè)問題。.navbar-brand {  font-weight: bold;}<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous"><div class="container">  <ul class="nav">    <li class="nav-item">      <a class="nav-link navbar-brand active" href="#">NotePro</a>    </li>    <li class="nav-item ">      <a class="nav-link" href="#">LogIn</a>    </li>  </ul></div>
查看完整描述

3 回答

?
狐的傳說

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

您可以對元素使用 Bootstrap 類 d-flex 和 justify-content- Between?ul。

.navbar-brand {

? font-weight: bold;

}

<link rel="stylesheet" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">

<div class="container">

? <ul class="nav d-flex justify-content-between">

? ? <li class="nav-item">

? ? ? <a class="nav-link navbar-brand active" href="#">NotePro</a>

? ? </li>

? ? <li class="nav-item ">

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

? ? </li>

? </ul>

</div>



查看完整回答
反對 回復(fù) 2023-08-21
?
慕的地8271018

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

將此代碼添加到container


.container {

  display: flex;

  justify-content: space-between;

}

并將品牌移到ul標(biāo)簽之外


.navbar-brand {

  font-weight: bold;

}


.container {

  display: flex;

  justify-content: space-between;

}

<!DOCTYPE html>

<html dir="ltr">


<head>

  <meta charset="utf-8">

  <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">

  <link rel="stylesheet" href="new.css">

  <title>NotePro</title>

</head>


<body>

  <div class="container">

    <a class="nav-link navbar-brand active" href="#">NotePro</a>

    <ul class="nav">

      <li class="nav-item ">

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

      </li>

      <li class="nav-item ">

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

      </li>

      <li class="nav-item ">

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

      </li>

    </ul>

  </div>

</body>


</html>


查看完整回答
反對 回復(fù) 2023-08-21
?
holdtom

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

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">

<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>



<!--here is your code below-->


<nav class="navbar navbar-expand-lg navbar-light bg-light">

        <a class="navbar-brand" href="#">Navbar</a>

        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">

          <span class="navbar-toggler-icon"></span>

        </button>


        <div class="collapse navbar-collapse" id="navbarSupportedContent">

            <ul class="navbar-nav ml-auto">

                <li class="nav-item active">

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

                </li>

                <li class="nav-item">

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

                </li>

                <li class="nav-item dropdown">

                    <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">

                Dropdown

              </a>

                    <div class="dropdown-menu" aria-labelledby="navbarDropdown">

                        <a class="dropdown-item" href="#">Action</a>

                        <a class="dropdown-item" href="#">Another action</a>

                        <div class="dropdown-divider"></div>

                        <a class="dropdown-item" href="#">Something else here</a>

                    </div>

                </li>

                <li class="nav-item">

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

                </li>

            </ul>

            <form class="form-inline my-2 my-lg-0">

                <input class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search">

                <button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>

            </form>

        </div>

    </nav>

在您的 UL 上使用 ml-auto



查看完整回答
反對 回復(fù) 2023-08-21
  • 3 回答
  • 0 關(guān)注
  • 224 瀏覽

添加回答

舉報(bào)

0/150
提交
取消
微信客服

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

 幫助反饋 APP下載

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

 公眾號(hào)

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