之前写博客主题的时候，也考虑到blockquote引用加背景引号图片这个问题，不过我用blockquote引用并不多，所以忽略掉了。昨天野鹤问我这个问题如何处理，我看了下他写的代码，是借鉴他搜索的DEMO。当然那DEMO上的效果肯定是对的，但我没有急于看DEMO，而是看他写的代码为什么没有实现想要的效果。
野鹤的页面很好理解，在blockquote右下角设置反引号的背景图片，在blockquote里的p标签的第一个汉字，设置正引号背景图片。我当时想，p:first-letter既然不好设置背景图片，为什么不直接在p标签设置正引号图片，然后做个padding:left，自然图片就出现在文字的左边了。
我按照他的思路和代码，帮他写了个DEMO1，效果确实出来了，也兼容了IE6/7/8、FF、chrome。
核心CSS代码：
blockquote{background:url("icon_quote_e.gif") no-repeat right bottom;}
blockquote p{padding:10px 30px;background:url("icon_quote_s.gif") no-repeat left top;}
但是想起曾经我写文章时，blockquote里面好多段落，所以有好几个p标签，那么昨天的DEMO2就会出现另外的效果。原因很简单，就是我把正引号写到了p上，而如果有好几个p标签，那么每一段开头都会有正引号，而这不是我要的效果。所以再思考更为合理的写法。
所以我就打开野鹤昨天给我的DEMO，但问题又来了，那个DEMO和WordPress的HTML结构不一样，那DEMO直接blockquote引用后面就是文字，而WordPress默认blockquote引号里会有p标签。如果我借鉴那DEMO的blockquote:first-letter写法，就出现其他问题，所以只有放弃first-letter。
跑去CSS手册里翻其他伪类，发现first-child这个伪类，他的作用是设置第一个对象。我想这应该是我要的，我把blockquote p:first-child第一个p标签加背景不就OK了么？最后实现的效果DEMO3。
但是IE6却不支持first-child，所以还是没有找到最完美的方法。
这篇文章并不是告诉你blockquote引用加背景引号图片，而是告诉你一个思路，HTML和CSS每个标签和属性都是有用的，你加上任意一个属性，一定要说出你为什么要加他。不然你加他干嘛？增加代码量？