如何在css pseudoelements（:: before）中使用Material.io概述图标？

Question

我尝试使用::之前将Material.io图标添加到按钮，但它只显示已填充的图标。

没有关于如何设置图标的指南。

这是我的代码：

.view-site:before{
    content: "\E8F4";
    font-family: 'Material Icons';
}

如何显示轮廓图标？

Answer 1

几周前Google声称新主题功能，但显然没有关于如何使用轮廓，锐利，圆润和双色调图标的线索。

我相信我们得到的唯一参考是： https://github.com/google/material-design-icons/issues/773

Answer 2

我相信你在CSS规则之前错过了点。这是固定的解决方案：

.view-site:before {
  content: "\E8F4";
  font-family: 'Material Icons';
}

<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<i class="view-site">
  
</i>