18

我必须在 html 页面上显示一堆文本。文本看起来像这样：

+-001 This is a Line            00:12:04
  002 ----------------------------------
- 003 Everthing looks good so far ------

文本是“预格式化的”，包含大量空白和破折号，每一行的长度相同（所有字符的宽度相同）。

有没有办法在不丢失格式的情况下以 html 显示文本？

4

3 回答 3

36

将您的文本包裹在<pre>标签内。

JSFiddle

<pre>
+-001 This is a Line            00:12:04
  002 ----------------------------------
- 003 Everthing looks good so far ------ 
</pre>
于 2013-08-20T07:44:50.217 回答
10

HTML 方法是使用preelement，它是为这种用途而设计的，但要注意

  • 为了安全起见，请将<pre>标签放在第一行的开头，将</pre>标签放在最后一行的末尾。否则，某些浏览器可能会表现得好像在元素的开头或结尾有一个空行。
  • 您仍然需要转义出现的字符<和&内容（在某些情况下不需要这样做，但最简单的方法是忽略它。

示例（我添加了包含表达式 1 + 1 < 3 的行）：

<pre>+-001 This is a Line            00:12:04
  002 ----------------------------------
- 003 Everthing looks good so far ------
- 004 Simple as 1 + 1 &lt; 3         ------</pre>

您可以避免转义<并&使用xmp而不是pre, 但xmp已被声明为已弃用、过时等（但在实践中效果很好）。

<xmp>+-001 This is a Line            00:12:04
  002 ----------------------------------
- 003 Everthing looks good so far ------
- 004 Simple as 1 + 1 < 3         ------</xmp>
于 2013-08-20T08:34:10.450 回答
2

尝试将内容包装为 PRE 标记。http://www.w3schools.com/tags/tag_pre.asp

于 2013-08-20T07:47:58.590 回答