将您的CSS更改为：

a:hover::after {
  font-family: 'Material Icons';
  content: "link";
  -webkit-font-feature-settings: 'liga';
}

因此您可以更改content: "[whatever icon here]";
FIDDLE
此外，小提琴没有正确加载图标字体，所以把我放在html中的链接。

舒伯特几乎有他们的答案，但如果你也想有IE10+支持，你需要添加font-feature-settings: 'liga' 1;，所以完成的造型将看起来像这样...

a:hover::after {
  font-family: 'Material Icons';
  content: "link";
  -webkit-font-feature-settings: 'liga' 1;
  -moz-font-feature-settings: 'liga' 1;
  font-feature-settings: 'liga' 1;
}

就像舒伯特说的，把content: "[whatever icon here]";改成你想要的图标。

如果你想使用一个有两个或更多单词的材质图标，那么你需要像这样使用下划线分隔符：

a:hover::after {
  font-family: 'Material Icons';
  content: "chevron_right";
}

如果你想在css pseudo中使用Material Icons，试试这个：

.p::before{
   font-family: "Material Icons";
   content: '\F019'
}

没有一个答案对我不起作用，所以我分享我找到的解决方案，并为我工作。

• （图标：右V形）*

TheElemnt:before {
    display: inline-block;
    font-family: "Material Design Icons";
}
TheElement::before{
    content: "\F0142";
}