twitter-bootstrap 引导程序删除下拉列表中的向上箭头
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/15792132/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
bootstrap remove upward arrow in dropdown
提问by Keith Power
I am using Twitter bootstap and wish to remove the upward arrow on the dropdown-menu whis is in my nav. I cannot find a reference in the bootstrap.css.
我正在使用 Twitter 引导程序并希望删除下拉菜单上的向上箭头，这在我的导航中。我在 bootstrap.css 中找不到参考。
.navbar .dropdown-menu:after {
content: '';
display: inline-block;
border-left: 6px solid transparent;
border-right: 6px solid transparent;
border-bottom: 6px solid #000; /* change color here, modified for a black arrow */
position: absolute;
top: -6px;
left: 10px;
}
回答by Shef
I would not recommend you to edit the bootstrap.cssfile. You can overwrite the styling in your custom stylesheet to hide the arrow for that component like this:
我不建议您编辑该bootstrap.css文件。您可以覆盖自定义样式表中的样式以隐藏该组件的箭头，如下所示：
.dropdown-menu:after {
border: none !important;
content: "" !important;
}
With this method you can even do the overwriting for a specific dropdown only. For example, if your dropdown was a child of an element with the id my_dropdown, you could do:
使用此方法，您甚至可以仅覆盖特定下拉列表。例如，如果您的下拉列表是具有 id 元素的子元素my_dropdown，您可以执行以下操作：
#my_dropdown .dropdown-menu:after {
border: none !important;
content: "" !important;
}
This would allow you to have an arrow for other dropdowns, while hiding it for this specific dropdown.
这将允许您为其他下拉菜单设置一个箭头，同时为该特定下拉菜单隐藏它。
回答by June Pecherska
The following css worked for me:
以下css对我有用：
.dropdown-menu:before,
.dropdown-menu:after {
border: none !important;
content: none !important;
}
If you remove any of the two selectors, some detail from the arrow would still remain - either a gray or a white triangle.
如果您删除两个选择器中的任何一个，箭头中的一些细节仍会保留 - 灰色或白色三角形。
(Just decided to add this in case someone is looking for an answer later, as the accepted answer didn't work for me.)
（只是决定添加这个以防有人稍后寻找答案，因为接受的答案对我不起作用。）
回答by Vidal Quevedo
You can also do:
你也可以这样做：
.dropdown-menu:before,
.dropdown-menu:after {
display:none;
}
This will disable the arrow and its shadow.
这将禁用箭头及其阴影。
