0

在 Firefox 中渲染文本区域字段时，我遇到了一个非常不寻常的问题。到目前为止，我还没有在 Mac 上测试过 18.0 以外的其他版本。

我的问题是，字体大小总是相对于 13px（操作系统默认值）而不是它的父级的 16px。如果我为它的父级定义一个固定的字体大小，它会按预期工作。但是，如果所有父母都有一个相对的字体大小，那么 textarea 的字体大小只是相对于我的操作系统默认值。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>Test Firefox ..</title>

    <style>
        /* Fixed sizes */
        /* body { font-size: 12pt; } */
        /* body { font-size: 16px; } */
        /* body { font-size: 0.4234cm; } */

        /* Dynamic sizes */
        /* body { font-size: 1em; } */
        /* body { font-size: 100%; } */
        /* body { font-size: medium; } */

        textarea { font-size: 1em; }
    </style>
</head>
<body>
    <textarea rows="4" cols="20">abc</textarea>
</body>
</html>

类似的问题，但不包括我的情况：Why <textarea> and <textfield> not take font-family and font-size from body?

任何人之前都经历过类似的事情，或者可以在其他浏览器（版本）或操作系统中确认这种行为？

编辑：这是 jsfiddle.net 上的代码：http: //jsfiddle.net/E4WwV/

4

2 回答 2

2

在 Firefox（我不知道其他浏览器是否也有）中，您可以设置两个默认字体大小：

  • 默认字体大小（16px）
  • 具有通用字体系列等宽字体(13px)的文本的默认字体大小

由于我的示例中的默认字体大小仅为 1em（对于 textarea 和正文），它是默认字体大小的 1 倍，所有等宽文本为 13px，所有其他文本为 16px。

这是一篇有很好解释的文章，也是一个可用的解决方法： http: //meyerweb.com/eric/thoughts/2010/02/12/fixed-monospace-sizing/

于 2012-12-09T19:24:45.263 回答
1

Textarea 和 body 使用不同的字体系列。Textarea 默认使用等宽系统字体，系统字体会根据您在 Gecko 中的浏览器字体偏好来调整它们的大小。因此，如果您的偏好将等宽字体的正常大小设置为 13 像素，那么在这种情况下您最终会得到...

于 2012-12-08T08:59:50.123 回答