css控制的代码,通过CSS控制把网页上的代码美化

博客发布文章时，如果文章里有代码块的，通过pre或者code可以让代码块更好美观；有效提升阅读感受。它就像是IDE工具里的主题一样，看着眼睛舒服；

这个问题困扰了我很久，由于时间的问题，一直没解决。今天利用CSS代码把这些代码进行了一些简单的美化。效果好看多了。

以下是美化用到的CSS代码：

/* 代码高亮 */

pre{font-family:"Microsoft Yahei","Helvetica Neue",Helvetica,Arial,sans-serif;

font-size:14px; width:92%; overflow:auto; margin:0 0 1em 0;

background:#423E3E;border-radius: 10px 10px; }

pre ol, pre ol li, pre ol li span{margin:0 0; padding:0; border:none}

pre a, pre a:hover{background:none; border:none; padding:0; margin:0}

pre ol{list-style:decimal; background:#423E3E; margin:0px 0px 1px 3em !important; padding:5px 0; color:#5C5C5C; border-left:2px solid #146B00;}

pre ol li{list-style:decimal-leading-zero; list-style-position:outside !important; color:#5C5C5C; padding:0 3px 0 10px !important; margin:0 !important; line-height:1.3em}

pre ol li.alt{color:inherit}

pre ol li span{color:#E5E0E0; background-color:inherit}

pre .comment, pre .comments{color:#008200; background-color:inherit}

pre .string{color:blue; background-color:inherit}

pre .keyword{color:#069; font-weight:bold; background-color:inherit}

pre .preprocessor{color:gray; background-color:inherit}

pre .dp-xml .cdata{color:#ff1493}

pre .dp-xml .tag, pre .dp-xml .tag-name{color:#069; font-weight:bold}

pre .dp-xml .attribute{color:red}

pre .dp-xml .attribute-value{color:#1169AD}

pre .dp-sql .func{color:#ff1493}

pre .dp-sql .op{color:#808080}

pre .dp-rb .symbol{color:#a70}

pre .dp-rb .variable{color:#a70; font-weight:bold}

pre .dp-py .builtins{color:#ff1493}

pre .dp-py .magicmethods{color:#808080}

pre .dp-py .exceptions{color:brown}

pre .dp-py .types{color:brown; font-style:italic}

pre .dp-py .commonlibs{color:#8A2BE2; font-style:italic}

pre .dp-j .annotation{color:#646464}

pre .dp-j .number{color:#C00000}

pre .dp-delphi .number{color:blue}

pre .dp-delphi .directive{color:#008284}

pre .dp-delphi .vars{color:#000}

pre .dp-css .value{color:black}

pre .dp-css .important{color:red}

pre .dp-c .vars{color:#d00}

pre .dp-cpp .datatypes{color:#2E8B57; font-weight:bold}