在Bootstrap上更改下拉图标4

Question

在Bootstrap 3上这很容易，你只需要改变跨度并添加你想要的任何图标。但Bootstrap 4似乎并不是这样。或者我错过了什么？

不管怎样，下面是它的基本代码：

<div class="dropdown"> 
    <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> 
    Dropdown button 
    </button> 
    <div class="dropdown-menu" aria-labelledby="dropdownMenuButton"> 
    <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> 
</div> 

可有人告诉我，如果有可能改变这一以及如何下拉图标？我想添加一个来自fontawesome。

谢谢！

Answer 1

你要隐藏这样的插入符号图标..

.dropdown-toggle::after { 
    display: none; 
} 

然后添加fontawesome图标..

<button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> 
    Dropdown button 
    <i class="fa fa-heart"></i> 
</button> 

http://www.codeply.com/go/xd2b75iUbM

OR，只是删除dropdown-toggle从按钮类，因为它只是目的似乎是显示脱字符图标。