用了Pinghsu主题，但是发现默认的代码高亮样式不好看，虽然不需要任何插件，但是有的代码不会被渲染，看起来觉得不舒服，而使用插件又会跟主题有冲突，于是决定自己改一下。
准备：

• CodeStyle插件
• 代码编辑器

CodeStyle开启monokai-sublime.css样式，不开启行号，目前没有解决，不要开启主题自带的代码高亮和其他代码高亮插件。

首先先移除主题自带的代码高亮样式，避免跟CodeStyle的样式冲突。编辑header.php，找到<link href="//cdn.bootcss.com/highlight.js/9.10.0/styles/xcode.min.css" rel="stylesheet">注释掉。
再编辑footer.php，找到<script src="//cdn.bootcss.com/highlight.js/9.10.0/highlight.min.js"></script>注释掉。

修改主题的样式表，找到如下代码，把color和background-color注释掉

.post-content pre code{
line-height:20px;
margin:0;
padding:1.3em;
/*color:#313131;
background-color:#f7f7f7*/
}

刷新页面再看看代码部分，然后我们发现行内代码背景色还是太淡，不能突显，再改一改
找到如下代码，把background-color改成如下:

code{
font-family:Menlo,Bitstream Vera Sans Mono,DejaVu Sans Mono,Monaco,Consolas,monospace;
font-size:13px;
margin:0 3px;
padding:2px 6px;
border-radius:3px;
background-color:#ccc
}

再刷新一次，看着就顺眼多了。

本文由 Ethan 创作，采用 知识共享署名4.0 国际许可协议进行许可。
本站文章除注明转载/出处外，均为本站原创或翻译，转载前请务必署名。