你不应该这样做

有一个原因,一个非常好的,最小的字体大小设置存在.简单来说,使用大多数字体,已经很难读取12px以下的任何内容,不要以低于9px的默认最小值.如果您的设计需要这样的字体大小,除了极其有限的情况¹,那么您的设计只是不好,排除了一大类用户.

你真的不应该这样做.

网络是一种本质上是灵活的媒介,良好的设计必须考虑到这一点.需要固定字体大小的设计适用于打印,但不适用于网页.任何不能满足这一要求的设计师都不了解媒体,没有一个体面的PM应该优先考虑设计师对实用性和可用性的不良决定.如果你不能反对这个决定,你有更大的,更根本的问题要处理.

你真的,真的不应该这样做.

根据您的管辖权,您可能会在合法的灰色地带徘徊.微小的字体大小难以阅读,使用户很容易错过信息,如果手边的文字具有法律上的重要性,如选择退出信息或免责声明,这一点特别麻烦.您还在薄冰上踩踏您的网站的可访问性,为视力障碍的人造成严重问题.

怎么办呢

很容易使Firefox显示字体小于最小指定大小的字体：只需使用the font-size-adjust property.

这里有科学的一点

每个字体都有一个叫做aspect值的东西,它是x的高度(字母x的高度)与你设置的实际字体大小之间的比例.例如,在漫画Sans中,这是真的很大(0.55),你可以通过比较较短的字母(a,c,e …)与较高的字母(b,d,h …)进行比较,而在Courier新的是更小(0.43).

这种变化可能会导致一些问题.例如,假设您为身体文字指定超级花式字体,但由于您是一名好的设计师,您可以提供几种后备字体.这很棒,但是因为其中一些回退具有不同的方面值,所以字母在您指定的大小上可能更小,更不清晰. font-size-adjust可以让您确保任何后备与您的超级花式字体具有相同的x高度.

不幸的是,我们也可以使用它来使文​​本更不清晰.让我们说你的身体副本是12px的Segoe UI：

body {
    font-family: "Segoe UI";
    font-size: 12px;
}

Segoe UI的方面值几乎正好为0.5,因此如果将其指定为font-size-adjust值,则字体大小不会更改：

body {
    font-family: "Segoe UI";
    font-size: 12px;
    font-size-adjust: 0.5; /* x-height = 12px × 0.5 = 6px */
}

如果我们把它设置得更小一些会发生什么？那么浏览器会调整字体大小来使用x-height等于font-size×font-size-adjust.例如,以下将导致有效的字体大小为6px：

body {
    font-family: "Segoe UI";
    font-size: 12px;
    font-size-adjust: 0.25; /* x-height = 12px × 0.25 = 3px */
}

这是我们攻击的基础.事实证明,即使Firefox覆盖了最小字体大小,Firefox也将会受到字体大小调整. (不用说,this is a bug.)

演示

Try this out in Firefox最小字体大小设置.它利用了两个错误：上述字体大小调整问题,以及通过getComputedStyle报告渲染字体大小的单独问题.

您需要知道您正在使用的字体的方面值来计算正确的字体大小调整值,this list of aspect values可能会帮助您. (或者,尝试一个estimated x-height for fonts installed on your system.)

可是等等！有更糟！

以上技术只适用于Firefox.在Webkit中的一个元素(包括Safari,iOS Safari和Chrome)上覆盖最小字体大小更容易,只需使用非标准的-webkit-text-size-adjust属性：

-webkit-text-size-adjust: none;

This is another bug,顺便说一句.文字大小调整是一种非标准提案,旨在限制移动设备上文字大小自动膨胀的程度.这不意味着在桌面UA上工作,更不用说防止手动文本调整大小.

最后一句话：它不会永远持续下去

错误最终被修复.你不是要覆盖浏览器的默认字体大小,无论你的不负责任的设计师和PM想要你多少.迟早,人们会发现,这些财产正在被利用,使得每个人的网络都变得更糟,有人会贴上补丁,乐趣会结束.

也就是说,如果你被迫这样做,我全心全意地倡导一种最终迫使有关各方重新考虑决定的解决办法.

¹提示：如果您的文本传达任何人可以读取的任何信息,那么您不应该弄乱浏览器辅助功能设置.合法案例包括纯粹的装饰效果(复杂的ASCII艺术,形状诗歌)和文件预览.

²更准确地说,从基线到中间高度的距离,这是大多数字体中字母x的高度.