自定义Blogger里的引用

我们知道在默认的Blogger里也存在一个“引用”，不过这个小小的Hack更实用些，用它来说明一些东西还是非常方便的。


这个Hack里用到三个变量，我们要先在Head里定义它。如鱼定义的代码为：

<Variable name="pullquoteBgColor" description="pullquoteBgColor" type="color" default="#660000" value="#003366">
<Variable name="pullquoteTextColor" description="pullquoteTextColor" type="color" default="#660000" value="#ffff66">
<Variable name="pullquoteborderColor" description="pullquoteborderColor" type="color" default="#660000" value="#e6e6e6">

里面有一些初始值，不要太关心，过一会我们可以方便的在“Fonts & Colors”里个性的设置它。

定义了变量我们就可以在CSS中添加以下CSS来“描述”这个区域了，在这里你也可以完全让它变成任意你喜欢的样子。

下面是CSS：

.pullquote {
width: 15%;
background-color:$pullquoteBgColor;
background-image: url(图片地址);
background-repeat: no-repeat;
color:$pullquoteTextColor;
float: right;
border:1px solid $borderColor;
font-weight:bold;
line-height:120%;
padding:40px 10px 10px 10px;
margin-top:10px;
margin-left:10px;
}

里面有一张图片，你需要自己保存并上传，最后改变CSS里的地址，右键另存这张图片

在最后的最后，我们要到“Fonts & Colors”里面点击鼠标来挑选我们喜欢的颜色，你会发现里面多了三个颜色变量。分别是：pullquoteBgColor（背景颜色）、pullquoteTextColor（文字颜色）、pullquoteborderColor（边框颜色）。如果你想在贴子里使用引用的时候，需要用＜span class="pullquote"＞＜/span＞将文字包围起来