知行社区

 找回密码
 立即注册

QQ登录

只需一步,快速开始

查看: 4024|回复: 2
收起左侧

借助SyntaxHighlighter实现代码高亮显示

[复制链接]
知行 发表于 2011-10-22 01:53 | 显示全部楼层 |阅读模式
SyntaxHighlighter (原名:dp.SyntaxHighlighter)是一套在浏览器上对各种代码进行语法着色的独立 JavaScript 库。格式化效果如下所示:


        
         <title>SyntaxHighlighter Build Test Page</title>
         <script type="text/javascript" src="sh/shCore.js"></script>
         
         
         <link rel="stylesheet" type="text/css" href="sh/shCore.css">
         <link rel="stylesheet" type="text/css" href="sh/shThemeDefault.css">
         <script type="text/javascript">
                 SyntaxHighlighter.config.clipboardSwf = 'sh/clipboard.swf';
                 SyntaxHighlighter.all();
         </script>



<h1>SyntaxHihglighter Test</h1>
<p>This is a test file to insure that everything is working well.</p>

<div id="highlighter_903387" class="syntaxhighlighter  "><div class="bar  "><div class="toolbar"><a href="#viewSource" title="view source" style="width: 16px; height: 16px" class="item viewSource">view source</a><div class="item copyToClipboard"><embed width="16" height="16" id="highlighter_903387_clipboard" type="application/x-shockwave-flash" title="copy to clipboard" allowScriptAccess="always" wmode="transparent" flashVars="highlighterId=highlighter_903387" menu="false" src="sh/scripts/clipboard.swf"></div><a href="#printSource" title="print" style="width: 16px; height: 16px" class="item printSource">print</a><a href="#about" title="?" style="width: 16px; height: 16px" class="item about">?</a></div></div><div class="lines"><div class="line alt1"><table><tbody><tr><td class="number"><code>1</code></td><td class="content"><code class="plain">function test() : String </code></td></tr></tbody></table></div><div class="line alt2"><table><tbody><tr><td class="number"><code>2</code></td><td class="content"><code class="plain">{ </code></td></tr></tbody></table></div><div class="line alt1"><table><tbody><tr><td class="number"><code>3</code></td><td class="content"><code class="spaces">    </code><code class="keyword">return</code> <code class="plain">10; </code></td></tr></tbody></table></div><div class="line alt2"><table><tbody><tr><td class="number"><code>4</code></td><td class="content"><code class="plain">} </code></td></tr></tbody></table></div></div></div><p>


附件借助syntaxhighlighter提供对c/c++,java,c#,javascript,html等语言的支持,提供多种风格供选择。</p><p> </p><p>


SyntaxHighlighter (原名:dp.SyntaxHighlighter)是一套在浏览器上对各种代码进行语法着色的独立 JavaScript 库。格式化效果如下所示:


        
        <title>SyntaxHighlighter Build Test Page</title>
        <script type="text/javascript" src="sh/shCore.js"></script>
        
        
        <link rel="stylesheet" type="text/css" href="sh/shCore.css">
        <link rel="stylesheet" type="text/css" href="sh/shThemeDefault.css">
        <script type="text/javascript">
                SyntaxHighlighter.config.clipboardSwf = 'sh/clipboard.swf';
                SyntaxHighlighter.all();
        </script>



<h1>SyntaxHihglighter Test</h1>
<p>This is a test file to insure that everything is working well.</p>

<div id="highlighter_903387" class="syntaxhighlighter  "><div class="bar  "><div class="toolbar"><a href="#viewSource" title="view source" style="width: 16px; height: 16px" class="item viewSource">view source</a><div class="item copyToClipboard"><embed width="16" height="16" id="highlighter_903387_clipboard" type="application/x-shockwave-flash" title="copy to clipboard" allowScriptAccess="always" wmode="transparent" flashVars="highlighterId=highlighter_903387" menu="false" src="sh/scripts/clipboard.swf"></div><a href="#printSource" title="print" style="width: 16px; height: 16px" class="item printSource">print</a><a href="#about" title="?" style="width: 16px; height: 16px" class="item about">?</a></div></div><div class="lines"><div class="line alt1"><table><tbody><tr><td class="number"><code>1</code></td><td class="content"><code class="plain">function test() : String </code></td></tr></tbody></table></div><div class="line alt2"><table><tbody><tr><td class="number"><code>2</code></td><td class="content"><code class="plain">{ </code></td></tr></tbody></table></div><div class="line alt1"><table><tbody><tr><td class="number"><code>3</code></td><td class="content"><code class="spaces">    </code><code class="keyword">return</code> <code class="plain">10; </code></td></tr></tbody></table></div><div class="line alt2"><table><tbody><tr><td class="number"><code>4</code></td><td class="content"><code class="plain">} </code></td></tr></tbody></table></div></div></div><p>


附件借助syntaxhighlighter提供对c/c++,java,c#,javascript,html等语言的支持,提供多种风格供选择。</p><p> </p><p>

</p>

本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有帐号?立即注册

x
永安九九 发表于 2011-10-22 13:15 | 显示全部楼层
{:1_378:}  不懂……
 楼主| 知行 发表于 2011-10-22 18:20 | 显示全部楼层
永安九九 发表于 2011-10-22 13:15
不懂……

忙了一天了,终于宣告失败了,哎,不搞这个了{:1_379:}

QQ|小黑屋|手机版|知行技术社区 ( 湘ICP备11020288号-1 )

GMT+8, 2020-7-10 05:25 , Processed in 0.015355 second(s), 8 queries , Redis On.

Powered by Discuz! X3.4

Copyright © 2001-2020, Tencent Cloud.

快速回复 返回顶部 返回列表