我试图了解 Twitter Bootstrap 下拉菜单包含在导航栏中和不包含在导航栏中时的区别。
当它们包含在导航栏中时，扩展菜单上会显示一个向上的三角形/箭头。当不使用导航栏时，不会显示该三角形：
http://twitter.github.com/bootstrap/javascript.html#dropdowns http://twitter.github.com/bootstrap/javascript.html#dropdowns
我刚刚花了两个小时探索 css/html，我仍然不明白为什么......
任何想法 ？
在 nav 元素内时，有两种样式应用于下拉菜单。它们如下：
.navbar .nav > li > .dropdown-menu::before {
position: absolute;
top: -7px;
left: 9px;
display: inline-block;
border-right: 7px solid transparent;
border-bottom: 7px solid #CCC;
border-left: 7px solid transparent;
border-bottom-color: rgba(0, 0, 0, 0.2);
content: '';
}
.navbar .nav > li > .dropdown-menu::after {
position: absolute;
top: -6px;
left: 10px;
display: inline-block;
border-right: 6px solid transparent;
border-bottom: 6px solid white;
border-left: 6px solid transparent;
content: '';
}
他们在彼此之上创建两个三角形，一个浅灰色，另一个深灰色。
如果您使用 Chrome 开发人员工具，您可以检查这些元素并关闭不同的样式以了解它们正在做什么。如果没有导航栏，这些样式不会应用
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
