csdn代码高亮显示源码.doc

csdn代码高亮显示源码 效果图如下： 一、首页主文件： Index.htm !DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN /TR/xhtml1/DTD/xhtml1-strict.dtd html xmlns=/1999/xhtml head !--这里导入css和js----- link type=text/css rel=stylesheet href=Styles/SyntaxHighlighter.css/link script class=javascript src=Scripts/jquery.js/script script class=javascript src=Scripts/shCore.js/script !--这里css和js导入结束-- meta http-equiv=Content-Type content=text/html; charset=utf-8 / /head body !--这里是示例-- div class=article_content textarea cols=50 rows=15 name=code class=php $a=bb; echo $a; /textarea /div !--示例结束-- !--这里是放在最底部的js-- script type=text/javascript $(document).ready(function () { $(.article_content pre).each(function () { var $this = $(this); if ($this.attr(class).indexOf(brush:) != -1) { var lang = $this.attr(class).split(;)[0].split(:)[1]; $this.attr(name, code); $this.attr(class, lang); } }); dp.SyntaxHighlighter.HighlightAll(code); }); /script !--最底部的js结束-- /body /html 二、放在头部head/head之间的文件： SyntaxHighlighter.css .dp-highlighter { font-family: Consolas , Courier New , Courier, mono, serif; font-size: 12px; background-color: #E7E5DC; width: 99%; overflow: auto; margin: 18px 0 18px 0 !important; padding-top: 1px; /* adds a little border on top when controls are hidden */ } /* clear styles */ .dp-highlighter ol, .dp-highlighter ol li, .dp-highlighter ol li span { margin: 0; padding: 0; border: none; } .dp-highlighter a, .dp-highlighter a:hover { background: none; border: none; padding: 0; margin: 0; } .dp-highlighter .bar { padding-left: 45px; } .dp-highlighter.collapsed .bar, .dp-highlighter.nogutter .bar { padding-left: 0px; } .dp-highlighter ol { list-style: decimal; /* for ie */ background-color: #fff; margin: 0px 0px 1px 45px !important; /* 1px bottom margin seems to fix occasional Firefox scrolling */ padding: 0px; color: #5C5C5C; } .dp-hi