twitter-bootstrap Bootstrap 4 从下拉按钮中删除插入符号
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/48176321/
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 4 remove caret from dropdown button
提问by random_user_0891
In Bootstrap 3 you could easily remove the "caret" (small arrow that points down) from a dropdown button, I can't see how to do it in Bootstrap 4 though because they no longer use <span class="caret"></span>.
在 Bootstrap 3 中,您可以轻松地从下拉按钮中删除“插入符号”(指向下方的小箭头),但我看不到如何在 Bootstrap 4 中执行此操作,因为它们不再使用<span class="caret"></span>.
<div class="input-group mb-3">
<div class="input-group-prepend">
<button class="btn btn-outline-secondary dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Dropdown</button>
<div class="dropdown-menu">
<a class="dropdown-item" href="#">Action</a>
<a class="dropdown-item" href="#">Another action</a>
<a class="dropdown-item" href="#">Something else here</a>
<div role="separator" class="dropdown-divider"></div>
<a class="dropdown-item" href="#">Separated link</a>
</div>
</div>
<input type="text" class="form-control" aria-label="Text input with dropdown button">
</div>
采纳答案by Alexandre Annic
It's done in css. Do something like that:
它是在 css 中完成的。做这样的事情:
.dropdown-toggle:after { content: none }
回答by Achmed Zuzali
Simply remove the dropdown-toggle!
只需删除dropdown-toggle!
Here is an example: https://jsfiddle.net/ydnosrLw/
这是一个例子:https: //jsfiddle.net/ydnosrLw/
回答by Mohamed Nagieb
You can remove the caret in Bootstrap 4 by removing the dropdown-toggleclass from your element. So instead of this:
您可以通过dropdown-toggle从元素中删除类来删除 Bootstrap 4 中的插入符号。所以而不是这个:
<button class="btn btn-outline-secondary dropdown-toggle" ...>
Your button will be
你的按钮将是
<button class="btn btn-outline-secondary" ...>
This won't have any side affects and it will still function properly as a dropdown.
这不会有任何副作用,它仍然可以作为下拉菜单正常运行。
回答by Gaslan
In Bootstrap 4 you can remove caret form dropdown button by setting $enable-caretsass variable false. But you must set this variable before importing the bootstrap sass file.
在 Bootstrap 4 中,您可以通过设置$enable-caretsass 变量来删除插入符号形式的下拉按钮false。但是你必须在导入 bootstrap sass 文件之前设置这个变量。
// Your variable overrides
$enable-caret: false
// Bootstrap and its default variables
@import "node_modules/bootstrap/scss/bootstrap";

