2010年12月7日星期二

为Blogger添加引用和代码引用功能

这个其实不是一个很必要的功能,不过却可以让我们的文章更整齐。

其实Blogger本身就有引用的功能了,不过其实不是说很好看,也不够明显。而至于代码引用,Blogger本身也没有刻意区分出来。

添加方法其实很简单,只是添加两段CSS代码而已。
方法如下:
1. Blogger后台——设计——修改HTML,然后记得备份模板。

2. 在]]></b:skin>之前添加以下代码:

/* Code And Blockquote
----------------------------------------------- */
CODE {
display: block; /* fixes a strange ie margin bug */
font-family: Courier New;
font-size: 8pt;
overflow:auto;
background: #f0f0f0 url(http://lh4.ggpht.com/_ZP12r_X7DY4/SWCJYSQejnI/AAAAAAAAAkk/_mxQeSGW_Ow/Code_BG.gif) left top repeat-y;
border: 1px solid #ccc;
padding: 10px 10px 10px 21px;
max-height:200px;
line-height: 1.2em;
}

.post blockquote {margin:1em 20px;padding-left:8px;background: #F5F8E8 url(http://lh4.ggpht.com/_ZP12r_X7DY4/SWCJKjaZ68I/AAAAAAAAAkg/UVjqWFi0DVQ/quo.gif) no-repeat;border-Left:2px solid #D0EC98;border-right:2px solid #D0EC98;background-position: left top;
}


红色那两段是图片的链接,你也可以使用你自己喜欢的图片,不过请重新上传到自己的空间。

3. 保存。

4. 以后只要是引用的话,便把引用的话放在<blockquote>及</blockquote>,代码引用则放在<code>及</code>之间就行了。

例子:
<blockquote>引用文字</blockquote>

<code>引用代码</code>

linfavourite signature
进一步查看我的其它网站

1 条评论:

LinkWithin

Related Posts Plugin for WordPress, Blogger...