Code-Prettify-for-Typecho 修复代码高亮插件行号错位

插件行号错位

想找一款 Typecho 代码高亮插件，试了 Code-Prettify-for-typecho ，但是代码块的行号错位

换了各种同类插件，都不是很满意，Code-Prettify-for-typecho 这个总体还可以，错位问题只能自己修复了。

只需两步完成修复

1. 选一款高亮样式，我选了 /usr/plugins/CodeHighlighter/static/styles/tomorrow-night.css 这个。

修改 tomorrow-night.css 第140行（不同高亮样式位置可能不同，但修改内容是一样的）。

font-size: 100%; 改为 font-size: 13px;

.line-numbers .line-numbers-rows {
    position: absolute;
    pointer-events: none;
    top: -2px;
    font-size: 100%; /* 将 100% 修改为 13px */
    left: -3.8em;
    width: 3em; 
    letter-spacing: -1px;
    border-right: 1px solid #999;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

2. 电脑端显示正常了，但手机端错误依旧存在，继续修改样式。

修改 /usr/themes/default/style.css

搜索 font-size:81.25%; ，删除或注释这个样式即可。

代码块首行没有左对齐

序号问题解决，发现第一行代码偏移了3个像素，强迫症实在受不了

修改 /usr/themes/default/style.css

搜索 padding:3px; 修改为 padding:0px;

pre code {
    padding:3px; /* 将 3px 修改为 0px */
    color:#444;
    }

修改后首行对齐了，但行号又偏了，继续微调

再次打开 /usr/plugins/CodeHighlighter/static/styles/tomorrow-night.css 这个文件。

修改 tomorrow-night.css 第139行（不同高亮样式位置可能不同，但修改内容是一样的）

top: 0px; 改为 top: -2px; （具体数值根据实际情况调整）

.line-numbers .line-numbers-rows {
    position: absolute;
    pointer-events: none;
    top: 0px; /* 将 0px 修改为 -2px */
    font-size: 13px; 
    left: -3.8em;
    width: 3em; 
    letter-spacing: -1px;
    border-right: 1px solid #999;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

上面的代码片段可以看出调整后的效果，至此大功告成。