首页 > emlog > Emlog的一种代码着色方法
2014
01-16

Emlog的一种代码着色方法

优点:非插件、调用JS文件小

缺点:使用中稍微有点繁琐

步骤一:添加CSS

<code>/*====代码着色====*/ .code {padding-left:30px;} pre { white-space:pre-wrap; /*css-3*/ white-space:-moz-pre-wrap; /*Mozilla,since1999*/ white-space:-o-pre-wrap; /*Opera7*/ white-space:-pre-wrap; /*Opera4-6*/ margin: 10px 0; padding: 10px 15px; text-align: left; overflow: auto; width:92%;word-wrap:break-word; font-size:12.5px; color:#555; background: #ffffe0; border: 1px solid #f2f2f2; border-left: 4px solid #CC0000; } pre.sh_sourceCode{color:#401e7a;font-weight:400;font-style:normal;} pre.sh_sourceCode .sh_keyword{color:#ff3030;font-weight:700;font-style:normal;} pre.sh_sourceCode .sh_type{color:#f7b92c;font-weight:400;font-style:normal;} pre.sh_sourceCode .sh_string{color:#1861a7;font-weight:400;font-style:normal;} pre.sh_sourceCode .sh_regexp{color:#1861a7;font-weight:400;font-style:normal;} pre.sh_sourceCode .sh_specialchar{color:#1861a7;font-weight:400;font-style:normal;} pre.sh_sourceCode .sh_comment{color:#38ad24;font-weight:400;font-style:normal;} pre.sh_sourceCode .sh_number{color:#32ba06;font-weight:400;font-style:normal;} pre.sh_sourceCode .sh_preproc{color:#5374b0;font-weight:400;font-style:normal;} pre.sh_sourceCode .sh_symbol{color:#3030ee;font-weight:400;font-style:normal;} pre.sh_sourceCode .sh_function{color:#d11ced;font-weight:400;font-style:normal;} pre.sh_sourceCode .sh_cbracket{color:#3030ee;font-weight:400;font-style:normal;} pre.sh_sourceCode .sh_url{color:#1861a7;font-weight:400;font-style:normal;} pre.sh_sourceCode .sh_date{color:#ff3030;font-weight:700;font-style:normal;} pre.sh_sourceCode .sh_time{color:#ff3030;font-weight:700;font-style:normal;} pre.sh_sourceCode .sh_file{color:#ff3030;font-weight:700;font-style:normal;} pre.sh_sourceCode .sh_ip{color:#1861a7;font-weight:400;font-style:normal;} pre.sh_sourceCode .sh_name{color:#1861a7;font-weight:400;font-style:normal;} pre.sh_sourceCode .sh_variable{color:#00f;font-weight:400;font-style:normal;} pre.sh_sourceCode .sh_oldfile{color:#1861a7;font-weight:400;font-style:normal;} pre.sh_sourceCode .sh_newfile{color:#1861a7;font-weight:400;font-style:normal;} pre.sh_sourceCode .sh_difflines{color:#ff3030;font-weight:700;font-style:normal;} pre.sh_sourceCode .sh_selector{color:#00f;font-weight:400;font-style:normal;} pre.sh_sourceCode .sh_property{color:#ff3030;font-weight:700;font-style:normal;} pre.sh_sourceCode .sh_value{color:#1861a7;font-weight:400;font-style:normal;}</code>

步骤二:调用JS
<code><script src=”<?phpechoTEMPLATE_URL;?>code.js”type=”text/javascript”></script></code>
步骤三:使用方法

在写文章需要加入代码时切换到“HTML状态”,参照下面的方法添加代码
<code></code>
<div>
<pre>相应的代码</pre>
<pre></pre>
</div>
具体的pre标签中怎么写class,你可以参照这里:readme

最后,记得要修改JS和相关文件代码的路径。
附件下载:精简版代码高亮emlog

最后编辑:
作者:admin
这个作者貌似有点懒,什么都没有留下。

留下一个回复