WP-syntax(Wordpress代码高亮插件）的使用及简单美化

在Wordpress里发表一些代码，估计是各位大大们经常碰到的事，相关的插件也很多，这里就简单说一下本站在用的WP-syntax插件吧，安装很简单，相信会玩Wordpress的都知道哈（插件--搜索--安装--启用），下面来说说简单的使用办法吧。担心代码冲突，所以下面“（”和“）”在使用时换成“<“和”>“即可。

<pre lang="html" line="1" escaped="true">
//这里添加代码……
</pre>

注释：lang="html"表示代码语言为html，请根据自己需要修改； line="1" 表示显示行号，如果不需要，去掉即可；escaped="true" 是为了防止代码转义，如果不需要，去掉即可。 注意：在wordpress后台使用 WP-Syntax 等代码高亮插件，需要在html模式下添加代码，不要随意切换到可视化模式，否则代码就容易转义！！ 由于插件本身的CSS不是很美观，建议修改一下，本站用的CSS代码如下（覆盖该插件的 wp-syntax/wp-syntax.css 的代码）：

.wp_syntax {
color:#100;
background-color:#f9f9f9;
border:1px solid #EBEBEB;
margin:0 0 1.5em 0;
overflow:auto;
}
.wp_syntax {
overflow-x:auto;
overflow-y:hidden;
padding-bottom:expression(this.scrollWidth > this.offsetWidth ? 15:0);
width:99%;
}
.wp_syntax table {
border:none;
border-collapse:collapse;
margin:0;
padding:0;
width:100% !important
}
.wp_syntax caption {
padding:2px;
width:100%;
background-color:#def;
text-align:left;
font-family:Monaco;
font-size:13px;
line-height:20px;
}
.wp_syntax caption a {
color:#1982d1;
text-align:left;
font-family:Monaco;
font-size:13px;
line-height:20px;
text-decoration:none;
}
.wp_syntax caption a:hover {
color:#1982d1;
text-decoration:underline;
}
.wp_syntax div,.wp_syntax td {
border:none;
text-align:left;
padding:0;
vertical-align:top;
}
.wp_syntax td.code {
background:none;
line-height:normal;
white-space:normal;
padding-left:10px;
}
.wp_syntax pre {
background:transparent;
margin:0;
padding:0;
width:auto;
float:none;
clear:none;
overflow:visible;
font-family:Monaco;
font-size:13px;
line-height:20px;
white-space:pre;
}
.wp_syntax td.line_numbers pre {
border-right:3px solid #6CE26C;
background-color:#E7E5DC;
color:gray;
width:20px;
padding:0 5px;
text-align:right;
}

写的简单了点，有空再来补充一下哈，各位看官多多见谅哈。