javascript – SVG-Schriftskalierungsproblem in Chrome- und Mobilterminals mit niedriger Version.
怪我咯
怪我咯 2017-05-16 13:32:50
0
1
634

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.

怪我咯
怪我咯

走同样的路,发现不同的人生

Antworte allen(1)
仅有的幸福

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

Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!