Question

我正在尝试在各个fontawesome图标周围添加边框（使用Unicode代码）。例如，在我正在使用的CSS文件中：

content: "\f008\00a0\f001\00a0\f26c"

但是如果我尝试在这里添加边框，它会在所有三个图标周围放置一个边框。有没有办法可以分别围绕三个图标中的每个图标（而不是00a0空格）。

谢谢

Answer 1

不是......它是一个具有多个字符的元素（或伪元素）......所以你只能得到一个边框。

这就像尝试在span中围绕单个字母设置边框一样......无法完成。

最好的是，Font-Awesome提供了一种使用堆叠将图标边框放置在图标上但通常仅用于单个图标的方法。你是否可以调整是有争议的。

可能是一个有趣的实验。

应该完成的方式：

＆＃13;

html {
  box-sizing: border-box;
}
*,
*::before,
*::after {
  box-sizing: inherit;
  margin: 0;
  padding: 0;
}
i:before {
  font-family: 'FontAwesome';
}
i.one:before {
  content: "\f008";
}
i.two:before {
  content: "\f001";
}
i.three:before {
  content: "\f26c";
}

＆＃13;

<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css" rel="stylesheet" />
<span class="fa-stack fa-lg">
  <i class="fa fa-square-o fa-stack-2x"></i>
  <i class="fa one fa-stack-1x"></i>
</span>
<span class="fa-stack fa-lg">
  <i class="fa fa-square-o fa-stack-2x"></i>
  <i class="fa two fa-stack-1x"></i>
</span>
<span class="fa-stack fa-lg">
  <i class="fa fa-square-o fa-stack-2x"></i>
  <i class="fa three fa-stack-1x"></i>
</span>

＆＃13;

围绕个别unicode fontawesome图标边界？

1 个答案: