Ueditor代码高亮的设置方法

okgoes 2023-05-09 13:07:14
Categories: Tags:

使用uparse的方式

1
2
3
4
5
<script type="text/javascript" charset="utf-8" src="/ueditor.parse.min.js"> </script>
uParse(".panel-body.detail", {
rootPath:'/path',  //第三方高亮插件的位置
chartContainerHeight:500
});

使用SyntaxHighlighter.highlight();或SyntaxHighlighter.all();

1
2
<link href="/Contents/ueditor/third-party/SyntaxHighlighter/shCoreDefault.css" rel="stylesheet" type="text/css" />
<script src="/Contents/ueditor/third-party/SyntaxHighlighter/shCore.js" type="text/javascript"></script>

代码高亮后设置自动换行

1
2
3
4
5
6
7
8
9
10
11
12
.syntaxhighlighter
{
    width100% !important;
    margin: .3em 0 .3em 0 !important;
    position: relative !important;
    overflow: auto !important;
    background-color#f5f5f5 !important;
    border1px solid #ccc !important;
    border-radius4px !important;
    border-collapse: separate !important;
    word-break:break-all; /* 新增样式 */
}