如何删除引导下拉容器?

Suh*_*ong 5 html css frontend twitter-bootstrap

问题

如图中所述,我试图摆脱下拉选项周围的透明容器。我尝试了多个无效的 CSS 解决方案。这是下拉菜单的 HTML 代码:

    		$('.navbar .dropdown').hover(function() {
		  $(this).find('.dropdown-menu').first().stop(true, true).slideDown(250);
		}, function() {
		  $(this).find('.dropdown-menu').first().stop(true, true).slideUp(105)
		});
Run Code Online (Sandbox Code Playgroud)
 <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
      <ul class="nav navbar-nav navbar-right">
        <li class="dropdown">
          <a href="#" class="dropdown-toggle" data-toggle="dropdown">Home</a>
          <ul class="dropdown-menu"> 
            <li><a href="#">Action</a></li>
            <li><a href="#">Another action</a></li>

        <li><a href="#home" class="page-scroll">Home</a></li>
        <li><a href="#about-section" class="page-scroll">About</a></li>
        <li><a href="#services-section" class="page-scroll">Services</a></li>
        <li><a href="#contact-section" class="page-scroll">Contact</a></li>
      </ul>
    </div>
Run Code Online (Sandbox Code Playgroud)

小智 5

那么它是您不想要的容器阴影吗?如果是这样,您可以.dropdown-menu通过添加类似的内容来更改类 css

.dropdown-menu {
    border: none;
    border-radius: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
}
Run Code Online (Sandbox Code Playgroud)

如果这不起作用,请在未消失的属性!important之前添加;,如下所示:

.dropdown-menu {
    border: none !important;
    /* etc... */
}
Run Code Online (Sandbox Code Playgroud)