3

所以我有这个代码：

<span readonly="true" id="textarea" cols="60" rows="1">
  <pre style="{display:inline; white-space: pre-wrap; word-wrap:break-word;}"> SOME TEXT HERE </pre>
</span>

我有两个问题。当我引入一个很长的字符串时，没有空格或换行符。例子：

啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊

在 Firefox 和 Opera 上显示正常：

aaaaaaaaaaaaaaaa
aaaaaaaaaaaaaaaa
aaaaaaaaaaaaaaaa

等等

在 chrome、IE 和 safari 上显示：

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa

并退出屏幕

我需要一些帮助。哦，第二个问题是在 chrome、IE 和 safari 上而不是显示内联，即使我写了 display:inline; 它也会显示块。

已解决：我没有使用它，所以它从一开始就是内联的。就像你们说的那样，我取出 {} 并且它起作用了！谢谢

4

2 回答 2

3

我怀疑这是因为您没有定义宽度，并且根据我的经验，它word-wrap仅适用于块元素（inline-block如果您需要它来包装和内联，您可以设置）。

您将 apre放在具有 aspan属性的 a 中也很奇怪textarea。

http://jsfiddle.net/A2MNN/

HTML：

<pre>
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa.
</pre>

CSS

pre{
    width:40em;
    word-wrap:break-word;
    white-space:pre-wrap;
}
于 2012-05-24T15:17:50.933 回答
1

您的标记无效，浏览器不准备处理，并且您的样式表违反了 CSS 规则。这意味着您应该期望浏览器显示垃圾，可能在不同的浏览器上显示不同的垃圾。

要获得真正问题的帮助，您应该将问题描述为完整且有效的 HTML 文档（不是解决未指定问题的完全破坏方式），即您想要实现的目标，并展示您解决该问题的最佳尝试.

于 2012-05-24T17:34:15.477 回答