これまでblockquoteは、おたまじゃくしテキストを画像にし、cssで背景画像指定にして、引用の場合のデザインを作っていました。しかし、レイアウトの幅が色々可変される事を考えた場合、背景画像よりもテキストでデザイン出来た方がやはり便利だなと思ったので、サーチしてみたところ、「blockquoteタグをCSSだけで格好良いデザインにする【画像不要】」という記事を見つけました。お～！テキストだけのデザインでここまで出来るのだ！と感動しました。ポイントは、position: relative;、:beforeや :afterなどの擬似要素を使うことのようです。

しかし、IEの場合は、IE8からでしか擬似要素はサポートされていないので、IE7以下の場合、何も表示されなくなります（その他のモダンブラウザでは表示できる。）IE7の使用率が低ければ良いですが、そうで無い場合、やはり、せっかくなので引用デザインが適用されたものを見て欲しいと思ってしまいます。

そういうわけで、IE7は一体どれ程の割合で日本国内で使用されているのだろうと、疑問に思ったので調べた所、2014年7月において、2.44%、いらっしゃいました。by「彩雲 マーケットシェアチェックツール」より。また、はてなカウンターに至っては、2014年7月でIE7は5.97%もいらっしゃいました。結構高い割合でまだ使用されているようです。

ですので、モダンブラウザとIE8以上の場合は、擬似要素のテキスト版での表示が良いですが、IE7以下の場合、引用部分の左側だけおたまじゃくし文字画像を使っての表示、という振り分けが良いかなと考えています。

振り分けは、MTを使っているので、以下のように＜MTSetVar＞を使った振り分けも良いだろうし、
＜!--[if IE 7]＞
＜MTSetVar name="browser_ie7" value="1"＞
＜![endif]--＞

CSSだけで振り分け、であれば、coliss様の記事の「IEの異なるバージョンごとにスタイルシートを適用する方法のおさらい」の方法でも良いかなと思いますし、旧来のIE7用ハックを使用という方法もあるかと思います。

相変わらず、自分用覚書でした。