为何bootstrap 的菜单有的div下直接生效,有的还得套个div?
两个平级的div topdiv和left div:
<body>
<div id="topdiv"></div>
<div id="leftdiv"></div>
他们基本就是位置不同:
#topdiv{
position: absolute;
top:0px;
height:50px;
width:100%;
}
#leftdiv{
position: absolute;
top:50px;
bottom: 0px;
left:0px;
width:320px;
}
分别让它们有菜单:
<div id="leftdiv" class="btn-group">
<button type="button" class="btn btn-default btn-lg dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
test1
<span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu" style="padding:0">
<li>
<button class="btn btn-default btn-lg btn-block" onclick="alert(this)">test1</button>
</li>
<li>
<button class="btn btn-default btn-lg btn-block" onclick="alert(this)">test2</button>
</li>
</ul>
</div>
leftdiv下不弹出!topdiv下弹出!leftdiv下包裹一个div像这样:
<div id="leftdiv"><div class="btn-group">...菜单内容...</div></div>
也能弹出!那么到底为何leftdiv下直接放菜单不弹出呢?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
他做组件的时候就是那样写的呗
这块儿的源码没看过,楼主可以翻出来看看,要我猜的话写事件代理的时候bootstrap就是根据这样的数据结构写的吧