Question

是否可以为资产（而不是嵌入式SVG）设置SVG的@font-face规则？

我知道你可以在SVG <defs>中设置样式，但我在谈论在CSS文件中设置它们。

我有数百个SVG图像，它们都有类似的东西：

<text id="Text" font-family="SlatePro-Bk"</text>

我的CSS中定义了SlatePro-Bk，SVG不会选择它。

我试着无济于事：

svg {
  font-family: 'SlatePro-Bk';
}

我的CSS中的字体规则是：

@font-face {
    font-family: 'SlatePro-Bk';
    src:  url('../fonts/slatePro-bk.eot') format('eot'),
          url('../fonts/slatePro-bk.otf') format('otf'),
          url('../fonts/slatePro-bk.woff2') format('woff2'),
          url('../fonts/slatePro-bk.woff') format('woff');  
}

有什么建议吗？

Answer 1

我保罗，要在SVG中包含字体，您不仅要在css中声明它，还要在SVG元素中声明它。

在您的SVG元素中，您可以输入：

@RibbonClient(name = "cloud-provider", configuration = CloudProviderConfiguration.class)
public class ConsumerApplication { 
    /* ... */
}

class CloudProviderConfiguration {
    @Bean
    public IRule ribbonRule(IClientConfig config) {
        return new RandomRule();
    }
}

希望它有所帮助！

卡蒂娅

Answer 2

字体资源必须经过Base64编码并嵌入SVG文件中才能跨浏览器工作。我创建了一个工具来扫描文件并嵌入适当的资产。

https://github.com/BTBurke/svg-embed-font

如果有帮助，请告诉我。

在导入的SVG

2 个答案: