为什么Firefox不遵守pre包装的代码标签的CSS字体大小？ [英] Why does Firefox not honor CSS font-size for code tags wrapped in pre?
问题描述
我发现浏览器在处理字体大小方面存在不一致（在Mac OS X 10.11.4上）。我想知道这是Firefox中的一个错误，还是CSS中的错误，或者我对CSS的某些理解不甚了解？
这个JSFiddle 显示细节。在这样的部分：
< pre>前段开始
< code> **问题在这里**< /代码>
前段结束
样式 code {font-family：Courier; } 更改Safari和Chrome显示的字体大小，但不会更改Firefox。但在其他章节中，所有浏览器中的代码元素大小从13px增加到16px。
为什么在所有浏览器中设置 font-family 之后，字体大小从13px增加到16px？ 也许Firefox 是更改 font-family ，但不是 font-size 。然而， 改变了其他地方的字体大小，例如 p code >元素或列表中。
我猜测解决方案是在我关心它的位置（忽略可访问性）只用积分设置像素单位的明确字体大小。 / p>
从2006年可能相关的Firefox错误引用： Bug 328621 - 奇怪的默认值 monospace 字体大小 - 与比例字体不同
尽管浏览器之间的可移植性问题对我来说似乎并不重要。上次我想标记HTML以便在Mozilla和M $ IE中显示相同的单宽度部分时，我不得不求助于绝对字体大小，由于它们施加的可访问性问题，应该肯定避免这种字体大小。
是的，有一个简单的解决方法 - 更改设置。但大多数用户将使用默认值。 ： - （
这个问题并不新鲜; 等宽字体的浏览器处理非常棘手并且不一致浏览器，有许多解决方法可用，不需要你重写用户设置的等宽字体首选项，其中最复杂的是指定
font-family：monospace，monospace;
没错：在字体堆栈的末尾有两个 monospace 关键字。没有人知道它为什么会起作用;它只是。
Firefox的UA样式表包含对 -moz-fixed 关键字的引用，该关键字引用用户设置的首选项，其中包括family 和大小，尽管它是 font-famil的值y 属性。无论系统的默认等宽字体是什么，Firefox都会将偏好设置为13px。看起来， monospace，monospace 强制浏览器根据规范计算元素的字体大小，同时至少仍保留首选的等宽字体族。但这只是一个猜测。
这是一个错误吗？这取决于你问谁。如果你问浏览器供应商，他们可能会说这是故意的。如果你问其他作者，他们可能会把它称为一个错误。这是违反规范吗？不，因为规范允许浏览器实现默认值，但是他们喜欢。
I've found an inconsistency among browsers in handling font-size (on Mac OS X 10.11.4). I'd like to know if this is a bug in Firefox, or a bug in CSS, or am I not understanding something about CSS?
This JSFiddle shows the details. In a section like this:
<pre>Start of pre section
<code>**problem here!**</code>
End of pre section
</pre>
the style code { font-family: Courier; } changes the font-size shown by Safari and Chrome, but not in Firefox. Yet in other sections, the code element size increases from 13px to 16px in all the browsers.
Why does the font-size increase from 13px to 16px after setting the font-family in all browsers?
Perhaps Firefox is changing the font-family but not the font-size. Yet it does change the font-size in other places, like in code inside a p element or inside a list.
I'm guessing the solution is to just aggressively set explicit font size with pixel units wherever I care about it (ignoring accessibility).
Quote from possibly related Firefox bug from 2006: Bug 328621 - strange default monospace font size -- differs from the proportional fonts
Though the inter-browser portability problem this imposes doesn't seem that trivial to me. The last time I wanted to markup HTML so that the monospaced parts showed the same in both Mozilla and M$IE I had to resort to absolute font sizes, which should be certainly avoided due to the accessibility problems they impose.
And yes, there's a simple workaround -- changing the settings. But most of the users will use defaults. :-(
This issue is not new; it has been known for many years that browser handling of monospace fonts is incredibly screwy and inconsistent across browsers. A number of workarounds are available that don't require you to override the monospace font preference set by the user, the most perplexing of which is to specify
font-family: monospace, monospace;
That's right: two monospace keywords at the end of the font stack. Nobody knows why this works; it just does.
For what it is worth, Firefox's UA stylesheet contains references to a -moz-fixed keyword which refers to the preference that is set by the user, which includes both the family and the size despite it being a value for the font-family property. Firefox ships with the preference set to 13px in whichever the system's default monospace font is. It would seem that monospace, monospace forces the browser to compute the element's font-size according to the spec while still preserving the preferred monospace family, at least. But this is just a guess.
Is this a bug? It depends on whom you ask. If you ask browser vendors, they'll probably say this is intentional. If you ask other authors, they'll probably also call it a bug. Is this a spec violation? No, because the spec allows browsers to implement defaults however they like.
这篇关于为什么Firefox不遵守pre包装的代码标签的CSS字体大小？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
