不显示 ul 和 li 标签之间的下拉菜单

Question

我错过了什么吗？

我正在尝试使下拉菜单出现。当我缩小页面时，我可以看到菜单出现在栏上（我只能看到“主页”选项的提示）。但是，当页面完全打开时，它似乎根本没有打开。

        <ul>

          <li><a style="color:#1a1a1a;" class="welcometitle">Welcome back! <asp:Label ID="lblusuario" runat="server" ForeColor="#99ccff" Font-Bold="true"></asp:Label></a></li>

          <li style="float:right; background-color: #4CAF50;" class="dropdown"> <a class="dropdown-toggle" data-toggle="dropdown" role="button" <%--onclick="myfunction()"--%> href="#">

              <i class="fa fa-bars"></i>

              </a>

              <ul class="dropdown-menu" role="listbox">

                    <li><a href="#home" role="option">Home</a></li>

                    <li><a href="#about" role="option">About</a></li>

                    <li><a href="#contact" role="option">Contact</a></li>

              </ul>

          </li>

          <li style="float:right; padding-right:10px; padding-top:5px; padding-left:5px;"><input  type="text"  class="form-control" placeholder="Search.." name="search"/></li>

          <li style="float:right; padding-right:0px; padding-top:5px; background-color:#ffffff"><button class="btn"  type="submit"><i class="fa fa-search" style=""></i></button></li>

        </ul>

这是我的css代码，我真的不明白我错在哪里

.searchbar {

    float: left;

    margin: 0px 0;

}

ul#navigation {

    float: left;

    margin: 0 20px 0 0;

}

ul#navigation li {

    display: inline;

    margin-right: 10px;

}

* {box-sizing: border-box;}

ul {

  list-style-type: none;

  margin: 0;

  padding-left: 160px;

  overflow: hidden;

  background-color: #1160a2;

  top:0;

  width:100%;

  position:fixed;

}

/* Dropdown Button */

.dropbtn {

  background-color: #3498DB;

  color: white;

  padding: 16px;

  font-size: 16px;

  border: none;

  cursor: pointer;

}

/* Dropdown button on hover & focus */

.dropbtn:hover, .dropbtn:focus {

  background-color: #2980B9;

}

/* The container <div> - needed to position the dropdown content */

.dropdown {

  position: relative;

  display: inline-block;

}

Answer 1

如果有人遇到同样的问题，我发现答案在 css 类上：.show {display: block;}刚刚添加了“位置：固定”，就是这样&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; .show {display: block;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;position: fixed;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }