如何將下拉菜單放在導航欄中？

Question

因此，我剛剛開始從w3school學習html。 我已經開始了我的小項目，我將創建一個簡單的網站。 現在，我只能從導航欄中創建下拉菜單。 我似乎無法將其放在導航欄中。 ps。我編輯了一些我認為不相關的代碼。

    .topnav {
        overflow: hidden;
        padding-top: 6px;
        padding-bottom: 6px;
        margin: 0px;
    }
    .topnav h1 {
        text-align: center;
        font-size: 22px;
        color: #FFFFFF;
        margin: 0px;
    }
    .dropbtn {
        background-color: #3498DB;
        color: white;
        padding: 16px;
        font-size: 16px;
        border: none;
        cursor: pointer;
    }
    .dropdown {
        position: relative;
        display: inline-block;
        float: left;
    }
    .show {
        display:block;
    }
</style>
</head>
<body>
    <div class="topnav">
        <h1>Home</h1>
        <div class="dropdown">
            <button onclick="myFunction()" class="dropbtn">Menu</button>
            <div id="myDropdown" class="dropdown-content">
                <a href="#content">Content</a>
            </div>
        </div>
    </div>

Answer 1

在下面添加CSS和jQuery

CSS ::

 #myDropdown{
      display: none;
    }

jQuery的::

$('.dropbtn').click(function(){
     $(this).next('#myDropdown').stop(true,false).slideToggle();
  })

Answer 2

You have to use script for hide/show your dropdown menu, Here you can see script

http://jsfiddle.net/renukaSingh/njhwr4z2/

如何將下拉菜單放在導航欄中？

問題描述

2 個解決方案

解決方案1
1 2018-05-10 06:15:22

解決方案2
0 2018-05-10 06:56:45

如何將下拉菜單放在導航欄中？

問題描述

2 個解決方案

解決方案1 1 2018-05-10 06:15:22

解決方案2 0 2018-05-10 06:56:45

解決方案1
1 2018-05-10 06:15:22

解決方案2
0 2018-05-10 06:56:45