suchen

Heim  >  Fragen und Antworten  >  Hauptteil

javascript – SVG-Schriftskalierungsproblem in Chrome- und Mobilterminals mit niedriger Version.

In Shell-Browsern mit niedriger Version und mobilen Browsern wie 360 ​​Extreme Speed ​​kann die Schriftart im <tspan>-Tag in SVG nicht korrekt skaliert werden, in der neuesten Version von Chrome ist dies jedoch normal.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <style>
        tspan{
            display: block;
        }
    </style>
</head>
<body>
<p>
    <svg viewBox="0,0,1000,1000"  version="1.1" xmlns="http://www.w3.org/2000/svg">
        <text><tspan class="st5" y="55.9" x="5.5">After all the articles, ads, fliers, etc. have been prepared for the newsletter, the document should be assembled and may require </tspan></text>
    </svg>
</p>
</body>
</html>

Wenn das Fenster verkleinert wird, wird die Schriftgröße im Speed ​​Browser nicht reduziert, wenn es auf 12 Pixel skaliert wird. Es funktioniert gut im neuesten Chrome. Wenn Sie das Debugging-Tool 360 Extreme Speed ​​öffnen und das Attribut display:block entfernen, ist die Skalierung normal. Aber die direkte Einstellung von display:inline im CSS funktioniert auch nicht. es ist verkabelt.

怪我咯怪我咯2754 Tage vor713

Antworte allen(1)Ich werde antworten

  • 仅有的幸福

    仅有的幸福2017-05-16 13:34:50

    只要给svg设置样式 text-rendering="geometricPrecision" 就好了。

    Antwort
    0
  • StornierenAntwort