Twitter bootstrap 引导4从下拉按钮中删除插入符号

在Bootstrap3中，您可以很容易地从下拉按钮中删除“插入符号”（指向下方的小箭头），但在Bootstrap4中，我看不出该如何操作，因为它们不再使用

<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>

下拉列表

这是用css完成的。这样做：

.dropdown-toggle:after { content: none }

---

通过从元素中删除

下拉开关

类，可以删除引导4中的插入符号。因此，与此相反：

<button class="btn btn-outline-secondary dropdown-toggle" ...>

你的钮扣会扣上

<button class="btn btn-outline-secondary" ...>

---

这不会有任何副作用，它仍然可以作为下拉菜单正常工作。

只需删除

下拉切换开关即可

以下是一个例子：
在Bootstrap 4中，您可以通过设置
$enable caret
sass变量
false
删除插入符号表单下拉按钮。但在导入引导sass文件之前，必须设置此变量

// Your variable overrides
$enable-caret: false

// Bootstrap and its default variables
@import "node_modules/bootstrap/scss/bootstrap";

你可能需要一张支票！根据装载顺序，在该声明末尾显示重要信息。