我尝试使用下面的代码使用 font Awesome 5 呈现 Whatsapp 图标：
<i style="background-color: #25d366; color: white;" class="fab fa-whatsapp "></i>
但它看起来像这样：
我想要的是让它看起来像 Android 手机中出现的 Whatsapp 图标，即没有方形绿色背景。如何实现这一目标？
您可以尝试使用渐变为背景着色：
.fa-whatsapp {
color:#fff;
background:
linear-gradient(#25d366,#25d366) 14% 84%/16% 16% no-repeat,
radial-gradient(#25d366 60%,transparent 0);
}
<script defer src="https://use.fontawesome.com/releases/v5.2.0/js/all.js"></script>
<i class="fab fa-whatsapp fa-7x"></i>
<i class="fab fa-whatsapp fa-5x"></i>
<i class="fab fa-whatsapp fa-2x"></i>
使用 CSS 版本：
.fa-whatsapp {
color:#fff;
background:
linear-gradient(#25d366,#25d366) 14% 84%/16% 16% no-repeat,
radial-gradient(#25d366 58%,transparent 0);
}
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.2.0/css/all.css" >
<i class="fab fa-whatsapp fa-7x"></i>
<i class="fab fa-whatsapp fa-5x"></i>
<i class="fab fa-whatsapp fa-2x"></i>
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
