一尘不染

将Font Awesome图标制作成一个圆圈吗?

css

我在某些项目上使用了超棒的字体,但是我想对
超棒的字体图标做一些事情,我可以像这样轻松地调用一个图标:

<i class="fa fa-lock"></i>

是否有可能所有图标始终都带有边框的圆形?事情是这样的,我有一个画面:

Using

i
{
 background-color: white;
 border-radius: 50%;
 border: 1x solid grey;
 padding:10px;
}

会产生效果,但问题是图标总是比
旁边的文本或元素大,有解决方案吗?


阅读 484

收藏
2020-05-16

共1个答案

一尘不染

i.fa {

  display: inline-block;

  border-radius: 60px;

  box-shadow: 0px 0px 2px #888;

  padding: 0.5em 0.6em;



}


<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" />

<i class="fa fa-wrench"></i>

2020-05-16