SyntaxHighlighter插件修改代码块行高

SyntaxHighlighter插件修改代码块行高,在网页上难免要放一些代码片段,如果直接让代码显示出来就不太好看了,没有颜色标注,很难看清代码,所以,自己写?不现实,用插件?最好的解决方法,SyntaxHighlighter插件就是专门用于在网页上显示代码块的,使用wordpress的用户直接在后台->插件中搜索“SyntaxHighlighter”下载安装即可,其它程序的就只能自己去下载SyntaxHighlighter然后自己配置一些基本的参数了。

接下来说重点,SyntaxHighlighter默认的显示行高有点矮,代码多的话会显示很挤,不利于浏览,所以我们要更改它的行高,那么怎么去更改呢,很简单,修改它的一个核心css文件里的一个属性,就可以随意调整它的显示行高了,它有两个版本,分别是:verision2.x和verision3.x。

verision2.x版本核心样式css文件:/wp-content/plugins/syntaxhighlighter/syntaxhighlighter2/styles/shCore.css;
verision3.x版本核心样式css文件:/wp-content/plugins/syntaxhighlighter/syntaxhighlighter2/styles/shCore.css;

要修改哪一个版本自选,或者两个都修改,打开shCore.css文件后,找到“line-height: 1.1em”,往下滚滚就能找到这个属性了,然后修改这个参数就可以了,至于要多高自己慢慢调吧,我觉得“line-height: 1.6em”刚好合我心意,两个文件都可这样改,改了之后你再试试,是不是长高了?

分享到:
标签:CSS,行高,
^_^ 亲爱的客官,如果您觉得本文对您有好处,请移动你的鼠标点点下面的广告或上面的或右上角的,非常感谢~ ^_^

报歉!评论已关闭.