Question

我用BrushScriptStd字体创建了一个SVG徽标。它在Chrome，Safari和Opera中显示良好，但Firefox更改了字体，看起来非常实用。有谁知道我应该怎么做？

谢谢你的帮助！

这是svg代码

<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 15.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
     width="368.412px" height="181.334px" viewBox="0 0 368.412 181.334" enable-background="new 0 0 368.412 181.334"
     xml:space="preserve">
<g id="fga3kg_1_" display="none">
</g>
<g id="Capa_3">
    <polygon fill="#3373A9" points="129.496,132.001 317.226,132.001 367.401,0 179.671,0     "/>
</g>
<g id="Capa_2">
    <polygon fill="#84CAE2" points="1.01,181.334 161.01,181.334 208.302,31.334 48.303,31.334    "/>
    <text transform="matrix(1 0 0 1 35.1562 113.834)" fill="#FFFFFF" font-family="'BrushScriptStd'" font-size="70">Cafe Blau</text>
    <g id="qWsZ92_1_" display="none" opacity="0.25">
    </g>
</g>
</svg>

这是嵌入式SVG（html代码）：

<svg width="300" height="160" viewBox="0 0 300 160">
    <image xlink:href="/Users/MaxRuizTagle/Desktop/guardado por illustrator/logoprobando.svg" src="" width="270" height="200"/>
</svg>

我还没有通过@ font-face选项指定任何字体..再次感谢您的帮助！

Answer 1

Read about icon-fonts vs svg

I request you to use font-icon lisst of browser that supports font-icon

随着更多高分辨率/密度显示器的出现，使用图标字体将越来越重要。

在高密度显示器（> 300ppi）上，16×16px图标看起来很糟糕。由于自动缩放，它可能显示非常小或不清晰。另一方面，无论屏幕密度如何，1em字体图标都能正确，清晰地呈现。

当然，这一切都归结为你的
应用程序用户和您的要求（IE7似乎是主要的断路器）

下载font-icon
http://genericons.com/#codepen
http://fontello.com/

Tool to create font-icon

SVG不会在Firefox中加载Web字体

1 个答案: