페이지에 코드를 배치하고 </tt> 태그로 묶습니다. <tt>name</tt> 속성을 <tt>code</tt>로 설정하고 <tt>class</tt> 속성을 사용하려는 <a href="http://code.google.com/p/syntaxhighlighter/wiki/Languages">언어 별칭</a> 중 하나로 설정하세요. </p>
<div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="code" style="PADDING-RIGHT: 0.5em; PADDING-LEFT: 0.5em; PADDING-BOTTOM: 0.5em; MARGIN-LEFT: 2em; BORDER-LEFT: #ccc 3px solid; PADDING-TOP: 0.5em"><pre name="code" class="c-sharp">
... some code here ...
참고: 주의해야 할 중요한 사항 중 하나는 삼각 괄호 <를 여는 것입니다. 모든 경우에 <에 해당하는 HTML로 대체되어야 합니다. 실패하면 페이지가 손상되지 않지만 표시된 소스 코드가 손상될 수 있습니다.
</tt>의 대안은 <tt><textarea></tt> 태그를 사용하는 것입니다. 이 경우 <tt><</tt> 문자에는 문제가 없습니다. 주요 문제는 어떤 이유로든 JavaScript가 작동하지 않는 경우(예: RSS 피드에서) <tt><pre class="brush:php;toolbar:false"></tt> 태그만큼 좋아 보이지 않는다는 것입니다. </p>
<div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="code" style="PADDING-RIGHT: 0.5em; PADDING-LEFT: 0.5em; PADDING-BOTTOM: 0.5em; MARGIN-LEFT: 2em; BORDER-LEFT: #ccc 3px solid; PADDING-TOP: 0.5em"><textarea name="code" class="c#" cols="60" rows="10">
... some code here ...
</textarea>
몇 가지 구성 옵션을 코드 블록에 전달하는 방법이 있습니다. 콜론으로 구분된 인수를 통해 수행됩니다.
<pre name="code" class="html:collapse"> ... some code here ...
마지막으로 페이지에 모든 것이 제대로 렌더링되도록 하려면 페이지에 JavaScript를 추가해야 합니다.
<link type="text/css" rel="stylesheet" href="css/SyntaxHighlighter.css"></link> <script language="javascript" src="js/shCore.js"></script> <script language="javascript" src="js/shBrushCSharp.js"></script> <script language="javascript" src="js/shBrushXml.js"></script> <script language="javascript"> dp.SyntaxHighlighter.ClipboardSwf = '/flash/clipboard.swf'; dp.SyntaxHighlighter.HighlightAll('code'); </script>
최적의 결과를 얻으려면 이 코드를 페이지 맨 끝에 배치하세요. 해당 기능에 대한 자세한 내용은 HighlightAll을 확인하세요.
下载地址:SyntaxHighlighter_1.5.0.zip