Question

似乎我在SVG中对字体大小或文本设置了下限。但是，我似乎无法在文档中找到任何相关内容。

我有一个巨大的div，其中包含一个巨大的SVG部分，它完全填充了视口。因此，我的字体大小可能小于0.0105pt。文本刚刚消失了！

请参阅此jsfiddle：https://jsfiddle.net/wc95t4dk/30/

<div style="position:absolute;top:-100000px; left: -100000px; width: 200000px; height:200000px">
    <svg width="100%" height="100%" viewbox="0 0 100 100">
        <text x="50.1" y="50.1" font-size="0.1pt" stroke="red" stroke-width="0.01" fill="red">My text</text>
        <text x="50.15" y="50.15" font-size="0.011pt" stroke="green" stroke-width="0.001" fill="green">My text2</text>
        <text x="50.25" y="50.15" font-size="0.01pt" stroke="blue" stroke-width="0.001" fill="blue">My text2</text>
    </svg>
</div>

红色和绿色文字显示正常，但蓝色文字没有显示！

Answer 1

我不确定所有浏览器，但Chrome和Firefox都不会呈现字体大小小于0.5个像素的文字。

请参阅：http://jsfiddle.net/vsxgy3fq/5/

然而，当涉及SVG res转换（和其他转换）时，事情会变得更复杂。我知道浏览器有（或有）与此大小检查相关的错误。

Answer 2

根据此答案https://stackoverflow.com/a/27165622/227507 这是由实现细节引起的，其中仅保留8位精度（1/256）用于十进制数字

SVG文本的大小是否最小？

2 个答案: