我在网上的模板中有一个下拉菜单。以下是下拉菜单的代码:
<!-- mega-menu start -->
<li class="dropdown mega-menu">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Clients</a>
<ul class="dropdown-menu">
<li>
<div class="row">
<div class="col-lg-8 col-md-9">
<h4>Customers</h4>
<div class="row">
<div class="col-sm-4">
<div class="divider"></div>
<ul class="menu">
<li><a href="page-about.html"><i class="icon-right-open"></i>About Us</a></li>
<li><a href="page-about-2.html"><i class="icon-right-open"></i>About Us 2</a></li>
<li><a href="page-about-3.html"><i class="icon-right-open"></i>About Us 3</a></li>
<li><a href="page-about-me.html"><i class="icon-right-open"></i>About Me</a></li>
<li><a href="page-team.html"><i class="icon-right-open"></i>Our Team - Options</a></li>
<li><a href="page-services.html"><i class="icon-right-open"></i>Services</a></li>
</ul>
</div>
<div class="col-sm-4">
<div class="divider"></div>
<ul class="menu">
<li><a href="page-contact.html"><i class="icon-right-open"></i>Contact</a></li>
<li><a href="page-contact-2.html"><i class="icon-right-open"></i>Contact 2</a></li>
<li><a href="page-coming-soon.html"><i class="icon-right-open"></i>Coming Soon Page</a></li>
<li><a href="page-404.html"><i class="icon-right-open"></i>404 error</a></li>
<li><a href="page-faq.html"><i class="icon-right-open"></i>FAQ page</a></li>
<li><a href="page-affix-sidebar.html"><i class="icon-right-open"></i>Sidebar - Affix Menu</a></li>
</ul>
</div>
<div class="col-sm-4">
<div class="divider"></div>
<ul class="menu">
<li><a href="page-left-sidebar.html"><i class="icon-right-open"></i>Left Sidebar</a></li>
<li><a href="page-right-sidebar.html"><i class="icon-right-open"></i>Right Sidebar</a></li>
<li><a href="page-two-sidebars.html"><i class="icon-right-open"></i>Two Sidebars</a></li>
<li><a href="page-no-sidebar.html"><i class="icon-right-open"></i>No Sidebars</a></li>
<li><a href="page-sitemap.html"><i class="icon-right-open"></i>Sitemap</a></li>
<li><a href="page-invoice.html"><i class="icon-right-open"></i>Invoice <span class="badge">v1.1</span></a></li>
</ul>
</div>
</div>
</div>
</div>
</li>
</ul>
</li>
客户端下拉菜单有三列。第一列有标题客户。如何给第二和第三列标题?每当我尝试这样做时,它都会混淆下拉列表的布局。
答案 0 :(得分:0)
试试这个:
<li class="dropdown mega-menu">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Clients</a>
<ul class="dropdown-menu">
<li>
<div class="row">
<div class="col-lg-8 col-md-9">
<div class="row">
<div class="col-sm-4">
<h4>Customers</h4>
<div class="divider"></div>
<ul class="menu">
<li><a href="page-about.html"><i class="icon-right-open"></i>About Us</a></li>
<li><a href="page-about-2.html"><i class="icon-right-open"></i>About Us 2</a></li>
<li><a href="page-about-3.html"><i class="icon-right-open"></i>About Us 3</a></li>
<li><a href="page-about-me.html"><i class="icon-right-open"></i>About Me</a></li>
<li><a href="page-team.html"><i class="icon-right-open"></i>Our Team - Options</a></li>
<li><a href="page-services.html"><i class="icon-right-open"></i>Services</a></li>
</ul>
</div>
<div class="col-sm-4">
<h4>Clients</h4>
<div class="divider"></div>
<ul class="menu">
<li><a href="page-contact.html"><i class="icon-right-open"></i>Contact</a></li>
<li><a href="page-contact-2.html"><i class="icon-right-open"></i>Contact 2</a></li>
<li><a href="page-coming-soon.html"><i class="icon-right-open"></i>Coming Soon Page</a></li>
<li><a href="page-404.html"><i class="icon-right-open"></i>404 error</a></li>
<li><a href="page-faq.html"><i class="icon-right-open"></i>FAQ page</a></li>
<li><a href="page-affix-sidebar.html"><i class="icon-right-open"></i>Sidebar - Affix Menu</a></li>
</ul>
</div>
<div class="col-sm-4">
<h4>Users</h4>
<div class="divider"></div>
<ul class="menu">
<li><a href="page-left-sidebar.html"><i class="icon-right-open"></i>Left Sidebar</a></li>
<li><a href="page-right-sidebar.html"><i class="icon-right-open"></i>Right Sidebar</a></li>
<li><a href="page-two-sidebars.html"><i class="icon-right-open"></i>Two Sidebars</a></li>
<li><a href="page-no-sidebar.html"><i class="icon-right-open"></i>No Sidebars</a></li>
<li><a href="page-sitemap.html"><i class="icon-right-open"></i>Sitemap</a></li>
<li><a href="page-invoice.html"><i class="icon-right-open"></i>Invoice <span class="badge">v1.1</span></a></li>
</ul>
</div>
</div>
</div>
</div>
</li>