如何将下拉列表添加到下拉列表中

时间:2017-08-18 01:13:00

标签: css drop-down-menu navbar

我无法弄清楚如何在我的导航栏中添加另一个下拉菜单。我已经有一个,但我需要在它上面添加另一个。

HTML:                            切换导航                                                 我们所做的                                              定制标志                          

                            定制标志                         数码印刷                         服务                             
                        数码印刷                         SERVICES

                    </li>
                 </ul>
            </li>
    <li role="presentation">
        <a href=" untitled.html" id="getanestimate">get an estimate</a></li>
           <li class="dropdown"><a data-toggle="dropdown" aria-expanded="false" href="#" class="dropdown-toggle">industry showcase<span class="caret"></span></a>
                <ul role="menu" class="dropdown-menu">
                    <li role="presentation"><a href="services.html">Price Package</a></li>
                    <li role="presentation"><a href="#">Order Services</a></li>
                    <li role="presentation"><a href="#">Custom Request</a></li>
                </ul>
            </li>
            <li role="presentation"><a href=" untitled.html">gallery</a></li>
            <li role="presentation"><a href="contact.html">about us </a></li>
            <!--<li role="presentation" id="getanestimate"><a href=" untitled.html">request service</a></li>
            <li role="presentation" id="getanestimate"><a href="contact.html">contact </a></li>-->
            <a class="navbar-text navbar-right actions"> <a class="btn btn-default action-button" role="button" href="signup.html">request service</a></a>
            <a class="navbar-text navbar-right actions"> <a class="btn btn-default action-button" role="button" href="signup.html"> contact</a></a>
            <a href="https://www.youtube.com/channel/UCwDYHL6wo6qBoOaRUKMsw-A"> <i class = "fa fa-youtube"></i></a> 
            <a href="facebook.com/arizonasignsplus"> <i class = "fa fa-facebook"></i></a>
            <a href="https://www.youtube.com/channel/UCwDYHL6wo6qBoOaRUKMsw-A"> <i class = "fa fa-twitter"></i></a>
        </ul>

        <!--<p class="navbar-text navbar-right actions"> <a class="btn btn-default action-button" role="button" href="signup.html">contact</a></p>
        <p class="navbar-text navbar-right actions"> <a class="btn btn-default action-button" role="button" href="signup.html"> request service</a></p>-->
    </div>
</div>

1 个答案:

答案 0 :(得分:0)

检查此链接我发现堆栈中某处可能对您有所帮助

click here

<div class="navbar navbar-fixed-top">
<div class="navbar-inner">
  <div class="container-fluid">
    <a data-target=".nav-collapse" data-toggle="collapse" class="btn btn-navbar">
      <span class="icon-bar"></span>
      <span class="icon-bar"></span>
      <span class="icon-bar"></span>
    </a>
    <a href="#" class="brand">Project name</a>
    <div class="nav-collapse">
      <ul class="nav">
        <li class="active"><a href="#">Home</a></li>
        <li><a href="#">Link</a></li>
        <li><a href="#">Link</a></li>
        <li><a href="#">Link</a></li>
        <li class="dropdown">
          <a data-toggle="dropdown" class="dropdown-toggle" href="#">Dropdown <b class="caret"></b></a>
          <ul class="dropdown-menu">
            <li class="dropdown-submenu">
              <a href="#">More options</a>
              <ul class="dropdown-menu">
                <li><a href="#">Second level link</a></li>
                <li><a href="#">Second level link</a></li>
                <li><a href="#">Second level link</a></li>
                <li><a href="#">Second level link</a></li>
                <li><a href="#">Second level link</a></li>
              </ul>
            </li>
            <li><a href="#">Another action</a></li>
            <li><a href="#">Something else here</a></li>
            <li class="divider"></li>
            <li class="nav-header">Nav header</li>
            <li><a href="#">Separated link</a></li>
            <li><a href="#">One more separated link</a></li>
          </ul>
        </li>
      </ul>
      <form action="" class="navbar-search pull-left">
        <input type="text" placeholder="Search" class="search-query span2">
      </form>
      <ul class="nav pull-right">
        <li><a href="#">Link</a></li>
        <li class="divider-vertical"></li>
        <li class="dropdown">
          <a class="#" href="#">Menu</a>
        </li>
      </ul>
    </div><!-- /.nav-collapse -->
   </div>
 </div>
</div>

<hr>

<ul class="nav nav-pills">
   <li class="active"><a href="#">Regular link</a></li>
   <li class="dropdown">
   <a href="#" data-toggle="dropdown" class="dropdown-toggle">Dropdown <b class="caret"></b></a>
   <ul class="dropdown-menu" id="menu1">
     <li class="dropdown-submenu">
      <a href="#">More options</a>
      <ul class="dropdown-menu">
        <li><a href="#">Second level link</a></li>
        <li><a href="#">Second level link</a></li>
        <li><a href="#">Second level link</a></li>
        <li><a href="#">Second level link</a></li>
        <li><a href="#">Second level link</a></li>
      </ul>
    </li>
    <li><a href="#">Another action</a></li>
    <li><a href="#">Something else here</a></li>
    <li class="divider"></li>
    <li><a href="#">Separated link</a></li>
  </ul>
  </li>
  <li class="dropdown">
    <a href="#">Menu</a>
  </li>
  <li class="dropdown">
    <a href="#">Menu</a>
  </li>
 </ul>