Question

我想知道是否有任何编译器能够解析css或scss文件替换所有对带有内联svg数据的* .svg文件的引用。我发现了这个：

body { background-image: 
    url("/assest/svg/test.svg");
  }

会变成

body { background-image: 
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='10'><linearGradient id='gradient'><stop offset='10%' stop-color='%23F00'/><stop offset='90%' stop-color='%23fcc'/> </linearGradient><rect fill='url(%23gradient)' x='0' y='0' width='100%' height='100%'/></svg>");
  }

我正在寻找一种方法来制作一个没有任何依赖关系的可移植css文件。到目前为止，我发现：https://github.com/jkphl/但到目前为止我的测试并没有表明数据内联可能有效。任何想法？

Answer 1

Compass允许您使用inline-image帮助程序内嵌图像...

background-image: inline-image("/assest/svg/test.svg");

svg到内联svg数据编译器

1 个答案: