Javascript 缩进“pre”代码块中的后续行

在大多数现代文本编辑器中，长行文本以与开头相同的缩进级别完美地包装

括号中的屏幕截图：

同样，对于接口元素，为了更好地理解：

但是在CSS中，使用

pre{white space:pre wrap；}

，长行缩进到窗口的左侧：

<style>
pre {white-space: pre-wrap}
</style>

<pre>
function() {
    if (a == b) {
        alert("Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.")
    }
}
</pre>

预{空白：预换行}
函数（）{
如果（a==b）{
警觉（“Lorem ipsum door sit amet，concetetur adipiscing elit，sed do eiusmod temporal incident ut laboure and dolore magna aliqua.”）
}
}

结果:

显然，阅读起来不是很方便

这就是为什么大多数人在他们构建的站点中使用

pre{overflow-x:auto；}

而不是

pre{white space:pre wrap；}

作为代码块的原因

可以用CSS/JS模拟类似于方括号的东西吗

另外，这个问题可能在一些库中得到了解决，比如Google Prettify，但我不知道。

您可以使用css，如：

---

或者参考这个-

老实说，我不明白为什么帕尔帕蒂姆删除了“jquery”标签，因为jquery通常用于简化困难的事情（我的任务肯定很难），但由于我尊重他的分数，嗯，好的。jquery标记被删除是因为1）没有迹象表明您正在使用库2）您不需要使用该库来解决此问题-这只能使用CSS来解决。

p {
  margin-left: 100px;
}