简体   繁体   English

有没有办法覆盖 webkit 浏览器中的最小字体大小?

[英]Is there a way to override the minumum font size in webkit browsers?

I am rendering tiny text on a canvas instance and it works as expected on Firefox 4, but on Chrome and Safari the font renders using the minimum font size set in these browsers, which is already at its minimum and can't be lowered through the UI, (which looks like a 6px font size) but it is still too big for what I want to accomplish.我在 canvas 实例上渲染微小的文本,它在 Firefox 4 上按预期工作,但在 Chrome 和 Z50DE9BC68C93DC32D8C7C7C90593471760Z 上,字体使用最小字体呈现,并且已经在这些浏览器中设置的最小字体大小不能UI,(看起来像 6px 字体大小)但对于我想要完成的任务来说仍然太大了。

The code I am using to print the font is similar to the following, in case it might be useful:我用来打印字体的代码类似于以下内容,以防它可能有用:

ctx.font = '4px Monospace';
ctx.fillText("Any text", 0, 10);

So, is it possible at all to override the minimum font size settings?那么,是否有可能覆盖最小字体大小设置?

Update : I know a text is not readable at 4px, but that's not the point of the question.更新:我知道文本在 4px 处不可读,但这不是问题的重点。 I don't need it to be readable at all, as a matter of fact.事实上,我根本不需要它可读。

Update 2 : On Safari this solution works, but it still doesn't work in Chrome.更新 2 :在 Safari 上, 此解决方案有效,但在 Chrome 中仍然无效。

Thanks.谢谢。

You could try using a bigger font and scaling the context :您可以尝试使用更大的字体并 缩放上下文

ctx.font = '8px Monospace';
ctx.save();
ctx.scale(0.5, 0.5);
ctx.fillText("Any text", 0, 20);
ctx.restore();

Remember to keep the scaling in mind when specifying the position of your text.请记住在指定文本的 position 时记住缩放比例。

This could easily reduce the graphics quality of the text, but at that size it will be pretty unreadable anyway.这很容易降低文本的图形质量,但在那个大小下,无论如何它都将很难阅读。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM