我想使用 <pre></pre> 来保持输入文本的格式，但是显示的文本跨越了它的父标签的边界<div></div>答案

【问题标题】：I want to use <pre></pre> to keep the format of input text, but the displayed text crosses the boundary of its parental tag<div></div>我想使用 <pre></pre> 来保持输入文本的格式，但是显示的文本跨越了它的父标签的边界<div></div>
【发布时间】：2009-11-05 04:52:11
【问题描述】：

<pre></pre> 中的文本超出了其父 <div></div> 的边界。如何解决这个问题？

据说可以缩短预格式化文本中的行长，但是怎么做呢？

见过

<%# DataBinder.Eval(Container.DataItem, "Comments")
               .ToString().Replace("\n", "<br />") %>

是c#吗？我是一名 PHP 程序员。

【问题讨论】：

标签： php css pre line-breaks

【解决方案1】：

您可以使用 CSS 使文本换行：

pre {
 white-space: pre-wrap;       /* css-3 */
 white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
 white-space: -pre-wrap;      /* Opera 4-6 */
 white-space: -o-pre-wrap;    /* Opera 7 */
 word-wrap: break-word;       /* Internet Explorer 5.5+ */
}

如果您根本不希望更改文本格式，此 CSS 将使用滚动条使所有文本都可见：

pre {
  width: 100%;
  overflow: auto;
}

【讨论】：

【解决方案2】：

尝试添加 CSS：

pre {
  width: 100%;
  overflow: auto;
}

【讨论】：

它只是切断了多余的文本。这不是一个解决方案。