如何使用css改变字体大小

Question

pre{font-family:cursive;font-style:italic;font-size:xxx-small}

如何更改pre字体大小？

Answer 1

虽然无法直接更改 pre 标记内文本的字体大小，但您始终可以将该文本包装在另一个元素（例如跨度）中并更改该元素的字体大小。

例如（这是内联样式，但如果您愿意，可以将其放入 CSS 中）：

<pre><span class="inner-pre" style="font-size: 11px">
Blah blah
Multiple lines and no br's!
Oh yeah!
</span></pre>

Answer 2

您的问题可能是由于 Courier 被用作默认字体，如果您将 Courier New 设置为首选字体应该没问题。

以下内容在 Firefox 和 Firefox 中都可以正常工作： IE

pre {
   font-family: "courier new", courier, monospace;
   font-size: 11px;
}

Answer 3

如果你只需要改变一次字体大小，你可以这样写

<pre style="font-size: 10px">
    ...
</pre>

Answer 4

看一下这里：

PRE - 预格式化文本

HTML 标签

您无法在一段时间内更改字体大小
PRE 元素（并且您不能将 PRE
FONT 元素内的元素，例如
示例），但是 BASEFONT 元素
也会影响预先格式化的文本。

Answer 5

固定 pre 标签上的字体大小的一种解决方案是使用：

pre
{
    white-space: pre-wrap !important;
}

这可以修复移动浏览器上的字体大小，因为移动浏览器无法准确确定 pre 元素的宽度。

来源：移动设备上预标记的字体大小设备变得太大——修复

Answer 6

这是 演示

我我不太清楚为什么我的浏览器（chrome、FF、IE）不同意！

如果我遗漏了什么，请告诉我。

HTML

<pre>
Test
</pre>

css

pre {
    font-size: 100px;
    font-family: "Times New Roman", Times, serif;
    font-style: italic;
}

Chrome

Firefox

IE

Answer 7

抱歉挖出一个老问题。在高低搜索“为什么浏览器（特别是移动浏览器）渲染

 标签文本太小且不可读”之后，我发现按照此处的建议，更改 css font-size:< /code> 到 em 有帮助。但问题是 em 的 
 效果在桌面浏览器和移动浏览器上的大小不同。对于相同的 em 值，Android Samsung/Mozilla/Chrome 上的字体大小增加量与桌面浏览器相比明显存在明显差异。解决这个困境的方法是使用 % 而不是 em。

 css 规则 pre{font-size:200%;} 似乎在移动浏览器上更一致地放大 
 文本（与其他文本相比），就像在桌面浏览器。

Answer 8

我认为这可能与不同浏览器支持的标准字体有关。在不同的浏览器中尝试您的代码，但请记住 IE 不兼容 W3。

Answer 9

我不确定这是否是正确的方法，但这在 Firefox 中对我有用：

font: normal 11px Verdana, Arial, sans-serif;