将白色背景添加到fontawesome图标

Question

我希望用白色背景填充问号图标。如您所见，在我的示例中，图标周围仍有一个小的白色边框。如何缩小背景，只填充问号？

body {
  background: lightgreen;
  font-size: 126px;
}

.fa-question-circle:before {
  background: white;
  border-radius: 100%;
}

<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.3.1/css/all.css" integrity="sha384-mzrmE5qonljUremFsqc01SB46JvROS7bZs3IO2EmfFsd15uHvIt+Y8vEf7N7fWAU" crossorigin="anonymous">

<i class="fas fa-question-circle"></i>

- Joba

---

几天前已经有类似的问题被提出：https://dev59.com/ja7la4cB1Zd3GeqPeYeX#52422180 - VXp

这里有一个更简单的方法，代码量更少：https://jsfiddle.net/m5zdf6eg/ - Temani Afif

Answer 1

您可以像下面这样使用background-image和线性渐变进行操作：

body {
  background: lightgreen;
  font-size: 126px;
}

.fa-question-circle:before {
  background-image: linear-gradient(#fff,#fff);
  background-repeat: no-repeat;
  background-size: 50% 75%;
  background-position: center;
}

<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.3.1/css/all.css" integrity="sha384-mzrmE5qonljUremFsqc01SB46JvROS7bZs3IO2EmfFsd15uHvIt+Y8vEf7N7fWAU" crossorigin="anonymous">

<i class="fas fa-question-circle"></i>

- Gerard