时间戳

首页 > 解决方案 > 在 html 页面中添加 Twitter 图标

html - 在 html 页面中添加 Twitter 图标

问题描述

如何在网站顶部生成 twitter、facebook 和 youtube 图标
https://store.linefriends.com/
如果我检查元素，我会看到以下 html：
<li><a href="https://twitter.com/_LINEFRIENDS" title="LINE FRIENDS INC on Twitter" rel="me" target="_blank" class="icon-twitter"></a></li>
不确定该图标是如何从该 html 行生成的这里没有图像等

标签： htmlcss

解决方案

您使用包含网络图标的字体系列（我可以看到“Turbo”）。

该图标是从类中生成的icon-twitter。在这个<a>元素里面有一个.icon-twitter::before包含内容值的伪元素 content: "\ea96";。这个值被解释为这个图标。

因此，如果您想更改此图标，您必须删除icon-twitter该类并将一个<img>元素与您的自定义图像文件一起放置（我建议您使用 svg 文件以获得更好的加载时间性能）。

推荐阅读