页面可以呈现的最大字体大小

Question

网页中可以呈现的最大字体大小是多少？

这取决于机器，还是应用程序（浏览器）？

Answer 1

不同浏览器的情况有所不同。例如，Mac/IE4+ 不会渲染指定 >255px 的字体。Opera 5 在 510px 之后会变得怪异。Mozilla 似乎能够处理高达 9362px 的值，这恰好也是 Netscape 4 的限制.

Answer 2

在 Firefox 3.6 中，最大实用字体大小似乎为 2000px。计算出的高度/行高上限约为 2657 像素，进一步增加不会改变显示。

Safari 5 和 Chrome 6（Webkit 浏览器）似乎允许尺寸高达（但不包括）1,000,000 像素，在此之后文本根本不会呈现。

Answer 3

是的。

每个设备都有一些它支持的字体和字体大小集。对于台式计算机来说，这两个集合都非常大，但对于电话或其他小型设备来说，这两个集合可能相当有限。对于具有纯文本屏幕的设备，可能只有一种尺寸的字体。

Answer 4

如果您使用内联 SVG，Chrome 会将字体大小限制为 8000 像素。以下代码将在 Firefox (V59) 中内联运行。 Chrome (V66) 将使以下

inline-svg

不可读：

<svg id="diagrammChart"
     width="100%"
     height="100%"
     viewBox="-400000 0 1000000 550000"
     font-size="27559"
     overflow="hidden"
     preserveAspectRatio="xMidYMid meet"
>
     <g class="hover-check">
        <text class="hover-toggle" x="-16800" y="36857.506818182" opacity="1" height="24390.997159091" width="953959" font-size="27559">
            <set attributeName="opacity" to="1" begin="ExampShow56TestBarRect1.touchstart"
                 end="ExampShow56TestBarRect1.touchend">
            </set>
            <set attributeName="opacity" to="1" begin="ExampShow56TestBarRect1.mouseover"
                 end="ExampShow56TestBarRect1.mouseout">
            </set>
            Heinz: -16800
        </text>
        <rect class="hover-rect" x="-16800" y="12466.509659091" width="16800" height="24390.997159091" fill="darkred">
            <set attributeName="opacity" to="0.1" begin="ExampShow56TestBarRect1.mouseover"
                 end="ExampShow56TestBarRect1.mouseout">
            </set>
            <set attributeName="opacity" to="0.1" begin="ExampShow56TestBarRect1.touchstart"
                 end="ExampShow56TestBarRect1.touchend">
            </set>
        </rect>
        <rect id="ExampShow56TestBarRect1" x="-384261" y="0" width="953959" height="48781.994318182"
              opacity="0">
        </rect>

     </g>
</svg>

Answer 5

可能两者兼而有之。它还取决于查看网页的显示器的尺寸。您想了解任何特定应用程序吗？