尝试使用z-index的隐藏DIV的一部分

这里是我的页面：如果您单击服务，你看到一个下拉菜单出现http://www.replyonline.co.uk/Brayborne/www/index.html 尝试使用z-index的隐藏DIV的一部分

在主导航。该导航类是.nav nav-pills nav-stacked.

我想这个下拉列表的顶部出现下面navbar-wrapper这样的box-shadow我在navbar-wrapper显示的下拉给它按低于设计分层的效果设置： -

enter image description here

会有人能够提供，我可以用它来实现这一目标的任何意见或CSS？此外，如果它有帮助，该网站是使用Bootstrap构建的。

感谢，

来源

2013-02-01 Tim

你不能在这里使用z-index，因为你的下拉列表在* navbar-wrapper里面。并且元素内的所有内容都是*元素的顶部。但是，您可以通过在下拉列表中应用箱形阴影插图来欺骗您的布局，并将其置于导航包装的边界。 – jgthms

的Z-index不会帮助你，因为你的下拉是里面你的navbar-wrapper，并且因此将永远是最重要的。

试试这个：

通过去除.navbar .nav > li > .dropdown-menu:before删除CSS箭头。

在您的下拉菜单，更改这些样式：

.dropdown-menu { 
    border-radius: 0 0 6px 6px; 
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2), 0 5px 5px rgba(0, 0, 0, 0.2) inset; 
    margin: 0; 
    top: 74px; 
}

结果：

Dropdown

更改的box-shadow值，以满足您的需求。

来源

2013-02-01 15:01:43 jgthms

这真棒，完全按照我的想象工作:)谢谢 – Tim

有点哈克，但应该让你去：

.dropdown-menu { 
    z-index: -1; 
} 

#myCarousel { 
    z-index: -2; 
}

工作演示：

http://jsfiddle.net/EGmZ5/

来源

2013-02-01 15:00:34

好戏。将尽力记住那一个。 – jgthms

尝试使用z-index的隐藏DIV的一部分

回答

相关问题