国产一级a片免费看高清,亚洲熟女中文字幕在线视频,黄三级高清在线播放,免费黄色视频在线看

對于一些程序代碼類的網(wǎng)頁，常常需要貼出代碼，但顯示效果往往很難讓人滿意(不能突出代碼)，如必優(yōu)博客使用的代碼高亮都是使用CSS控制輸出的，不是真正意義上的代碼高亮，只是顯示形式類似于代碼顯示，那如何實現(xiàn)一個代碼高亮效果？發(fā)現(xiàn)現(xiàn)在很多的代碼高亮都需要與服務(wù)端交互，使用也比較麻煩。這里介紹一個代碼高亮工具syntaxhighlighter語法高亮工具，它不需要與服務(wù)器交互，只需要包含相應(yīng)的格式代碼JS包，就可以輕松實現(xiàn)代碼高亮，使用非常簡單，本文以PHP為實例，談?wù)勅绾问褂胹yntaxhighlighter語法高亮工具優(yōu)化你的代碼顯示，讓你的代碼更加具有吸引力，首先看一下PHP實例的效果圖：

查看syntaxhighlighter語法高亮在線演示http://www.biuuu.com/demo/syntaxhighlighter/index.html

第一步，下載syntaxhighlighter語法高亮源碼包，當(dāng)前版本是2.0.320
http://alexgorbatchev.com/wiki/SyntaxHighlighter:Download

第二步，解壓文件包，文件包內(nèi)容如下：

第三步，如何使用syntaxhighlighter語法高亮工具，以PHP為例

一，包含文件部分

1. <script type="text/javascript" src="scripts/shCore.js"></script>
2. <script type="text/javascript" src="scripts/shBrushCss.js"></script>
3. <script type="text/javascript" src="scripts/shBrushJScript.js"></script>
4. <script type="text/javascript" src="scripts/shBrushPhp.js"></script>

shCore.js是一個核心包，其次分別是shBrushCss.js、shBrushJScript.js和shBrushPhp.js，因為只需要對PHP代碼進行高亮，所以其它的語法包沒有包含，把有用的JS包包含就行，這樣一方面有利于減少代碼，另一方面加速網(wǎng)頁打開的速度。

其次就是兩個核心的CSS樣式

1. <link type="text/css" rel="stylesheet" href="styles/shCore.css"/>
2. <link type="text/css" rel="stylesheet" href="styles/shThemeDefault.css"/>

這二個CSS樣式是一定需要的，因為所有的顯示控制都在這兩個CSS樣式文件中。

二，Javascript部分

1. <script type="text/javascript">
2. SyntaxHighlighter.config.clipboardSwf = 'scripts/clipboard.swf';
3. SyntaxHighlighter.all();
4. </script>

這里有一個剪貼板配置，然后調(diào)用了一個all()方法，表示調(diào)用包含文件中的所用語法包。

三，HTML部分

1. <pre class="brush: php;">
2. //PHP數(shù)組高亮顯示
3. $webName = array('必優(yōu)博客');
4. $webUrl = array('http://www.biuuu.com/');
5. $web = array_merge($webName,$webUrl);
6. print_r($web);
7. function goCurrent(){
8. $name = __FILE__;
9. echo $name;
10. }
11. </pre>

注意HTML部分，HTML代碼顯示在標(biāo)簽為<pre></pre>中，syntaxhighlighter默認會自動查找<pre />標(biāo)簽，其中標(biāo)簽可自定義，可以是<div />，<ul />，<ol />等等，只需要加上如下配置代碼：

1. SyntaxHighlighter.config.tagName = 'div';

同時根椐class類名選擇不同的格式刷，由于本文以PHP為實例，因此格式刷配置為PHP，如上：class="brush: php;"

如上方法就實現(xiàn)了PHP語法高亮顯示，是不是非常簡單！

當(dāng)我們把鼠標(biāo)移動到代碼區(qū)域時會顯示一個工具條，如下：

分別是顯示代碼，復(fù)制代碼，打印代碼和幫助四個功能，默認為英文，可以對這個工具條進行設(shè)置，如下代碼：

1. SyntaxHighlighter.config.strings = {
2. expandSource : '展開代碼',
3. viewSource : '查看代碼',
4. copyToClipboard : '復(fù)制代碼',
5. copyToClipboardConfirmation : '代碼復(fù)制成功',
6. print : '打印',
7. help : '?',
8. alert: '語法高亮\n\n',
9. noBrush : '不能找到刷子: ',
10. brushNotHtmlScript : '刷子沒有配置html-script選項',
11. aboutDialog : '<div></div>'
12. }

至于如何顯示提示文本，可自定義設(shè)置，其中最后一個選項aboutDialog 表示幫助對話框，可自定義配置HTML內(nèi)容。

其它一此配置大家可以查看shCore.js文件，分別有一個defaults和config選項，可自定義配置其中的選項。

使用syntaxhighlighter語法高亮工具非常簡單，輕松優(yōu)化你的代碼高亮顯示，試試吧！

查看syntaxhighlighter語法高亮在線演示
http://www.biuuu.com/demo/syntaxhighlighter/index.html

下載syntaxhighlighter語法高亮實例源碼包
http://jquerycodes.googlecode.com/files/syntaxhighlighter.rar