pre{font-family:cursive;font-style:italic;font-size:xxx-small}
如何更改pre字体大小？
问问题
77579 次
9 回答
43
虽然无法直接在 pre 标记内更改文本的字体大小，但您始终可以将该文本包装在另一个元素（例如跨度）中并更改该元素的字体大小。
例如（这是内联样式，但如果您愿意，可以放在 CSS 中）：
<pre><span class="inner-pre" style="font-size: 11px">
Blah blah
Multiple lines and no br's!
Oh yeah!
</span></pre>
于 2010-11-29T20:39:02.457 回答
12
您的问题可能是由于 Courer 被用作默认字体，如果您将 Courier New 设置为首选字体应该没问题。
以下在 Firefox 和 IE 中都可以正常工作
pre {
font-family: "courier new", courier, monospace;
font-size: 11px;
}
于 2012-04-11T14:40:17.740 回答
10
如果你只需要改变一次字体大小，你可以写
<pre style="font-size: 10px">
...
</pre>
于 2014-04-17T07:38:25.533 回答
8
看看这里：
您不能更改 PRE 元素中的字体大小（例如，您不能将 PRE 元素放在 FONT 元素中），但 BASEFONT 元素也会影响预格式化的文本。
于 2010-03-28T05:35:48.820 回答
4
这里是 Demo
我不太清楚为什么我的浏览器（chrome、FF、IE）不同意！
如果我遗漏了什么，请告诉我。
HTML
<pre>
Test
</pre>
css
pre {
font-size: 100px;
font-family: "Times New Roman", Times, serif;
font-style: italic;
}
铬合金
火狐
IE
于 2014-06-08T16:34:10.470 回答
3
在标签上固定字体大小的一种解决方案pre是使用：
pre
{
white-space: pre-wrap !important;
}
这修复了移动浏览器上无法准确确定pre元素宽度的字体大小。
于 2016-11-18T21:09:20.590 回答
2
我认为这可能与不同浏览器支持的标准字体有关。在不同的浏览器中尝试您的代码，但请记住 IE 与 W3 不兼容。
于 2012-08-14T04:25:53.380 回答
2
抱歉挖掘了一个老问题。在高低搜索“为什么浏览器（特别是移动浏览器）呈现<pre>标签文本太小且不可读”之后，我发现按照这里的建议，将 css 更改font-size:为em帮助。但问题是桌面浏览器和移动浏览器上em的<pre>效果大小不同。em在 android Samsung/Mozilla/Chrome 上，对于当时桌面浏览器的相同值，字体大小增加的明显差异明显。解决这个困境的方法是使用%而不是em.
css 规则pre{font-size:200%;}似乎<pre>在移动浏览器上更一致地放大文本（与其他文本相比），就像在桌面浏览器上一样。
于 2014-10-13T09:09:35.783 回答
1
我不确定这是否是正确的方法，但这在 Firefox 中对我有用：
font: normal 11px Verdana, Arial, sans-serif;
于 2018-04-02T11:21:15.497 回答