html - 让 OSX Safari 支持 css "white-space: pre"

Question

我有一个博客，我在其中使用 ccs style="white-space: pre"和 div 元素。我这样做是为了在博客中显示大量代码示例或 cli 输出。并且必须将该文本复制并粘贴到 html 页面中。

我希望源代码易于阅读，因此希望使用“white-space: pre”来在浏览器显示时保留原始输出的空白格式。

Chrome 和 Firefox 可以很好地显示 html 页面，但出于某些奇怪的原因……当我要求 Safari 只做“pre”时，Safari 正在做“pre-wrap”。我必须具有保留空白和 nowrap 组合功能......这是“pre”但 osx 的 safari 没有兑现。

有没有人有解决此类问题的方法？从大量测试中我很清楚，firefox 和 chrome 支持 CSS 空白属性定义的“pre”，但 osx 的 safari 不支持。我不想使用  ，因为这会使我的源代码 htm 难以阅读和管理。

在此先感谢您提供任何有用的建议。

Answer 1

我在 Safari 11.0.3 上也遇到过同样的问题，在 jQuery 对话框中出现了“whitespace: pre”格式。使用 pre 标签并不能解决问题。

但是，将“word-wrap: normal”添加到作品的样式中。这是我发现适用于我的场景的最终 CSS:

padding: 15px;
white-space: pre;
word-wrap: normal;
resize: none;
box-sizing: border-box;