11

我在我的前端网页中使用了 syntaxhighlighter 来突出显示代码。但是我遇到了一个问题，即当代码长度大于<div>. 在此处输入图像描述

然后我用谷歌搜索了它。并找到了下面提到的方法：

pre,code{ 
white-space:pre-wrap;/*css-3*/ 
white-space:-moz-pre-wrap;/*Mozilla,since1999*/ 
white-space:-pre-wrap;/*Opera4-6*/ 
white-space:-o-pre-wrap;/*Opera7*/ 
word-wrap:break-word;/*InternetExplorer5.5+*/　　
}

但是，出现了一个新问题，行号与实际代码行不对应： 在此处输入图像描述

我的问题是：

  • 如何在保持代码行与实际原始代码行对应的同时避免代码溢出？
4

3 回答 3

1

您可以使用CodeMirror编辑器。它有很多功能支持，包括自动换行和只读，如 Sublime 文本编辑器。

于 2017-09-25T10:35:43.103 回答
0

我猜它确实对应于原始代码行。由于包装，您弄乱了编号。尝试使用 JavaScript 包装代码 - 添加新行符号\n和插入符号返回符号\r（取决于您的编程环境及其设置），看看它是否有帮助。

于 2013-06-30T11:46:54.873 回答
-2

您还必须对 JavaScript 进行一些更改。

此处注释部分的底部对此进行了解释，包括 jsfiddle 中的演示：https ://bitbucket.org/alexg/syntaxhighlighter/issue/182/version-3-making-code-wrap

于 2013-06-30T11:11:17.910 回答