4

如果您只有一个字体系列，Icomoon 字体可以正常工作，但是如果我创建了另一个字体系列并想与第一个字体系列一起使用怎么办？我试图做这样的事情：

@font-face {
  font-family: 'icomoon';
  src:url('icomoon.eot');
  src:url('icomoon.eot?#iefix') format('embedded-opentype'),
  url('icomoon.woff') format('woff'),
  url('icomoon.ttf') format('truetype'),
  url('icomoon.svg#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'abccons';
  src:url('fonts/abccons.eot');
  src:url('fonts/abccons.eot?#iefix') format('embedded-opentype'),
  url('fonts/abccons.woff') format('woff'),
  url('fonts/abccons.ttf') format('truetype'),
  url('fonts/abccons.svg#abccons') format('svg');
  font-weight: normal;
  font-style: normal;
}

我的字体文件名与字体系列完全相同。我也为第一个字体图标使用“data-icon”属性，并为第二个字体图标使用“data-icon2”。

[data-icon]:before { content:attr(data-icon); font-family:'icomoon'; font-variant:normal; font-weight:normal; line-height:1; speak:none; text-transform:none; -webkit-font-smoothing:antialiased; }

[data-icon2]:before { content:attr(data-icon2); font-family:'abccons'; font-variant:normal; font-weight:normal; line-height:1; speak:none; text-transform:none; -webkit-font-smoothing:antialiased; }

不确定我是否以正确的方式进行操作。字体以http://css-tricks.com/html-for-icon-font-usage/中描述的方式加载。结果是：第一个字体正确加载，而第二个似乎已经加载了一些东西，但都显示为方形，而不是字体。如果我在 css 文件中设置为 data-icon2 但在 html 中使用 data-icon3 （打算出错），则不会加载任何内容。

任何想法？

4

1 回答 1

-1

检查路径.....有一个关于如何使用Icomoon图标的漂亮教程 http://chipcullen.com/how-to-use-icomoon-and-icon-fonts-part-1-basic-usage/。它会帮助你

于 2013-08-27T07:22:25.127 回答