Stack 3 字体真棒图标

Question

我正在尝试将 3 个图标从 font awesome 堆叠到彼此旁边。请参阅 image 以供参考。我知道 font awesome 有一个堆栈 class 但它似乎只有 2 个图标堆栈并且彼此重叠。此外，我希望各个图标在屏幕区域具有背景，以便这些区域被剪裁并且不会重叠。 我应该创建一个新的 svg 并使用它还是值得付出努力的 css 路线。 谢谢

Answer 1

我认为新的 SVG 是您的最佳选择。

参考你的图片，注意到 FontAwesome 图标是透明的，你将无法将 fa-laptop 堆叠在 fa-desktop 和 fa-mobile 图标前面，而不通过笔记本电脑的屏幕看到它们。

这是一个将它们与 CSS 和一些绝对定位堆叠在一起的演示，向您展示我的意思； https://jsfiddle.net/k3en9L4m/

span.stack{
   position: relative;   
}
span.stack i{
   position: absolute;
}