Question

我正在创建一个文本编辑器，我希望设置一个白色空间CSS属性选项，以便保留空格，但HTML代码中存在的换行符不会导致换行。

我正在创建的文本编辑器在所有方面都有边距，并且我希望一旦它到达＆lt; p＆gt;的结尾就有文本换行。标签。我希望用户能够在文档中放置尽可能多的空格而不进行压缩。

目前，我有 white-space：pre-wrap; ，但文档代码中的任何换行符也会导致文档中的换行符。这些换行符是由我拥有的文档转换器引起的，我不想修改它，除非绝对必要。虽然我不是很确定，但我非常怀疑Firefox，谷歌Chrome，Internet Explorer和Safari都避免在代码中放置换行符。因此，我发现我最好的选择可能是设置空白属性。

根据我所读到的关于白色空间：pre-line，它听起来与我想要的完全相反，它会折叠空间，并在代码行中断;

我想得到一个使用纯CSS的答案，但我可以使用一些Javascript，但我不愿意，因为这个问题不是最极端的。

谢谢！

修改： 这是JSFiddle对当前发生的事情的演示：http://jsfiddle.net/tXSQj/

代码： <p>A test paragraph</p> 代码结束

我想这样做，以便示例中的“段落”一词不会跳过一行做之前的换行。

Answer 1

对不起，但我不确定是否有一个简单的CSS解决方案。使用JavaScript可能更容易：

HTML:
<p id = "code">[stuff]</p>
<!-- Set the CSS white-space property to pre-wrap. -->

JavaScript:
var codeElem = document.getElementById("code");
codeElem.innerHTML = codeElem.innerHTML.split("\n").join(" ↵ ");

白空间保存，断线忽略

1 个答案: