bootstrap 4:带图标和文字的按钮

Question

我正在尝试使用Bootstrap 4创建按钮,如下所示:

图标(字体真棒)应该以文本为中心,并且所有图标在屏幕上具有相同的y位置.按钮的边框应该是不可见的.

我是否必须使用按钮或使用其他元素更好？欢迎任何帮助.

Answer 1

使用bootstrap-4和font-awesome,如果您想要显示文本左侧的图标,请使用以下代码段

<button class="btn btn-lg" style="background-color:transparent;">
   <i class="fa fa-pencil"></i> Edit
</button>

Answer 2

创建一个div，然后将字体很棒的图标放入其中，然后编写文本然后提供必要的css，然后您就可以(click)在div.

Install bootstrap and font-awesome 

然后在 angular-cli.json 的“样式”中提供路径。或者，

<button class='btn btn-lg ' style='background-color:transparent;'> 
  <div style='text-align:center;'><i class="fa fa-times"></i></div>  
    Cancel Reservation
</button>