Question

我使用grunt构建了我的javascript项目。它适用于javascript和css文件。请在下面找到我的CSS之一。

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

我在font目录中列出了所有这些文件。目前我需要在构建版本中提供此图标。我不想在我的构建版本中使用此图标文件。反正有没有把它整合到css ???

如何在grunt build中处理eot，woff，ttf和svg ???

Answer 1

将每个文件的数据转换为base64，并通过data uri将其直接嵌入到CSS中。

src url('data:[<MIME-type>];base64,<data>')

例如，对于SVG字体，MIME类型将是image / svg + xml。

咕噜声 - 建立eot，woff，ttf和svg

1 个答案: