简单更改CSS显示醒目的代码块

作者:半瓶墨水 链接:http://www.2maomao.com/blog/css-code-pre/

写上篇文章的时候,发现这儿的代码块,黑底绿字,没有代码加色,也很好。coolcode适合于显示某个语言的代码块,这个适合于shell脚本,或者命令行操作等内容的显示,比较醒目。

firebug 看了一下,很简单。在我的主题的style.css后面添了一句如下:

.mycode {
color:lime;background-color:black
}

然后在使用的时候,简单的用pre模块(class=”mycode”)把要显示的内容包括进去即可

<pre class="mycode">
要显示的内容
</pre>

手工加这个还是比较麻烦,我在wordpress后台用的是简单的Quicktags编辑器,自己曾经改过,加上下面这段:

edButtons[edButtons.length] =
new edButton('ed_code'
    ,
'code'
    ,
'<pre class="mycode">\n'
    ,
'</pre>\n'
    ,
'c'
);

现在用起来很方便,在后台选中一块文字,点击编辑器上面的”code”按钮,就一切OK了。

  • Share/Bookmark

555,本篇现在一条评论也没有,雁过留声,人过留名,各位乡亲父老,有钱的捧个钱场,没钱的捧个人场......

发表评论

  • :l
  • :)
  • :q
  • :(
  • :^
  • :x
  • :v
  • :D
  • :s
  • :h
  • :e
  • :X
  • :k
  • :w
  • :d
  • :p

注意:评论中需包含至少一个中文字,否则视为无效

Additional comments powered by BackType