【追記：2014年01月23日】
所属している会社では、「Internet Explorer 9」を利用しています。セキュリティーの関係で、自分で勝手にアップグレードできませんので、ちょっと不都合もありますが。特に、下記に示した引用符。以下の様になっています。
全てのブラウザーで確認しているわけではありませんから、こうしたことも致し方ないとは思うのですが・・・閲覧して下さっている方の中には、かなり迷惑な感触を抱いている方もいらっしゃるんだろうな～何て反省してはいるのですが。
【公開時、投稿記事】
「かっこいい」の定義が不明確ですが・・・ただ、単純に「blockquote」を適当するのではなく、ちょっと他のサイトでは利用していないような、それでいて結構目立つ引用符を作成したい・・・
そこで、「CSS3 を使って blockquote をちょっとおしゃれに | Unformed Building」にある例を参考にちょっとやってみました！
実際に適用しているコードは、本投稿記事の後半にアップしておきますが、実際には以下のように表示されるようなります。
引用符（いんようふ）は、約物の一つ。文中において、他の文や語を引用していることを示す役割を果たす記号で、多くの場合一対で引用部分を囲む。コーテーションマーク、クォーテーションマーク、クオーテーションマーク、引用符号ともいう。(出典:「引用符 – Wikipedia」より)
Internet Explorer の古いバージョンでは、上手く表示できないようですが・・・少なくとも CSS 3 をカバーしているブラウザーでは、私の思ったような表示になっているはず！
実際に適用しているコードは以下の通りです。
/* ======= Reseting Blockquote ======= */
blockquote { quotes:none; }
/* ======= blockquote要素前後にコンテンツを追加しないように指定しています ======= */
blockquote:before, blockquote:after { content:''; content:none; }
blockquote {
background: none; /* url(images/blockquote-l.png) no-repeat left top; */
position: relative;
margin: 10px 30px 10px 30px;
padding:15px 10px 2px 15px;
border:1px solid;
border-color:#bddcad #eee8aa #eee8aa #bddcad;
font-weight: normal;
font-style: normal;
text-align: left;
color: #501616;;
background-color:#edffdc; }
blockquote:before {
position: absolute;
top: 20px;
left: -75px;
z-index: 1;
width: 100px;
transform: rotate(-25deg); /* 反時計回りに25度回転 */
-moz-transform: rotate(-25deg);
-webkit-transform: rotate(-25deg);
-o-transform: rotate(-25deg);
color: #8fbc8f;
content: "Quote"; /* 文字列を生成 */
font-size: 30px;
font-weight: 700;
font-style: oblique;
font-family: Georgia normal, "Times New Roman", Times, serif;
text-align: center;
text-shadow: 3px 5px 3px rgba(0, 0, 0, .2); /* 文字にドロップシャドウ */ }
/* ======= Reseting Blockquote END ======= */
いや～素晴らしい！引用符だけで、こんなに長くなるんだ～とちょっと驚きましたが、やっただけの成果があったような気がしています。あくまでも自己満足の世界でしょうけど。