教程 | Blockquote 教学

blockquote 指的就是 “引用”，如图：

框框就是所谓的 blockquote

如果你还是不明白，可以看看这一个：

我就是 blockquote :)

1. 设计 → 修改 HTML

2. Ctrl + F 寻找代码 ]]></b:skin>

3. 在 ]]></b:skin> 上面添加 这一组代码：

blockquote {
background: url(图片 direct link);
border: 1px solid #000000;
text-shadow: 2px 2px 2px #cccccc;
padding: 5px;
font-color: #000000;
}

* 这一组代码是根据我的 blockquote 的 :)

小解释
1. background - 你的 blockquote 的背景图（你可以选择放背景颜色）
若是将之更改为背景色，请将 “ background ” 改成 “ background-color: #颜色代码; ”
2. border - 你的 blockquote 的框框（1px solid #000000;）
如果不要添加边框，可以删除掉这个代码

1px：框框的厚度
solid：框框的类型（可参考下图）
#000000：框框的颜色（可参考颜色代码）

3. text-shadow - 就是你的 blockquote 你的字有阴影（可以选择添加与否）

2px 2px 2px：px 越大，你的阴影离你的字越远

#cccccc：阴影的颜色（可参考颜色代码）

4. padding - 你的 blockquote 内容离开边框有多远（可以选择添加与否）
如果你没有添加边框，就可以删除掉这个代码
5. font-color - 字体的颜色（可参考颜色代码）

另一款 blockquote

*没错，我要放的就是开引号~ >,< 

背景色不用去理，因为我这个模板的背景本来就是蓝色的。

若果你使用这一款的 blockquote，就不用添加背景图以及边框了 :)

1. 设计 → 修改 HTML

2. Ctrl + F 寻找代码 ]]></b:skin>

3. 在 ]]></b:skin> 上面添加以下代码：

blockquote {

padding-left: 70px;

padding-top: 40px;

background: url(图片 direct link) no-repeat;

}

这个不需要解释，那个 padding 我已经调好了，不要再去调了 :)

图片 direct link 就换去那个开引号的 图片url。

这里有一些开引号的版本，大家可以看看，如果你要自己制作开引号，就不能使用我调给你的 padding 了，请自行调整

http://i1198.photobucket.com/albums/aa448/shehjing/blogger%20material/blockquote3.gif

http://i1198.photobucket.com/albums/aa448/shehjing/blogger%20material/blockquote.gif

http://i1198.photobucket.com/albums/aa448/shehjing/blogger%20material/blockquote1.gif

http://i1198.photobucket.com/albums/aa448/shehjing/blogger%20material/blockquote2.gif