Css 谷歌字体和跨浏览器Unicode

我正在我的一个项目中使用谷歌字体（

sourcesans-Pro

）。我有一个类，其中悬停

：：在
之后，我显示一个箭头。问题在于Safari、Chrome和Firefox都显示了不同的符号。我的意思是它是arrow，但是默认的google字体在两个浏览器（Chrome和Firefox）中不用于呈现Unicode
（2192）

请参见下图以了解问题。有没有办法让它们在浏览器中看起来和Safari中的一样


更新21-04-2017

因为只为一个箭头包含整个库有点过分。我用更好的解决方案更新我的awnser

使用类似的
应用程序生成
字体图标

搜索所需的
字体图标
（s），并下载生成的
字体
。只需将
字体
复制并粘贴到您的主机上即可

如果您想保持一个干净的结构或一个干净的
css
文件。您还可以将
style.css
的内容复制到所需的
css
文件中


原始雨篷

使用字体图标怎么样？有点像字体太棒了。
如果是这样，你必须这样做

在页眉中添加字体

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css">

有关使用字体的详细信息，请访问：

我曾考虑过使用字体，但问题是我已经嵌入了谷歌的字体，只需一个图标，添加一种新字体就有点“苛刻”了。这是真的。为此，有一个更简单的解决方案。创建自己的字体图标并将其放入style.css中。为了让事情变得简单，这里有一个很棒的网站：只需搜索箭头图像并生成字体图标。下载图标后，您可以将icomoon style.css的内容复制到您自己的style.css中。谢谢您的建议。这就是我最终所做的，以确保箭头在所有浏览器中显示相同。技术提示：源SAN是Adobe，而不是Google。这两个公司在这些字体上进行合作，但Adobe负责发布，并将其作为“源代码”发布。谷歌反过来发布了他们自己的品牌副本“Noto”（并且他们通过Adobe团队对源代码所做的更改使其保持最新）。也就是说：你的HTML和CSS在哪里？没有显示您是如何影响此文本的，我们只能猜测，猜测并不是很好的帮助。以下是
h1:：在{content:“\2192”字体系列之后：'Source Sans Pro'，Sans serif；}
。我只能使用自定义字体对其进行排序。不要将其添加为注释：您的帖子需要包含一些简化的（但）html和css，以便人们可以看到您的具体操作。否则，你会让他们猜你的问题=）
.class:after {
    font-family: FontAwesome;
    font-weight: normal;
    font-style: normal;
    display: inline-block;
    text-decoration: inherit;
}

.class:hover:after {
    content: "\f178";
}