(HTML)引用文とblockquote

他のサイトから記事を引用する場合、↓のような感じで引用されているのを見かけます。

引用

この文章は引用しています。

今まで、<blockquote>で文章を囲むと勝手に線で囲まれると思っていましたが、
本来は、段落を下げてくれるだけなんですね・・・。
ちなみに、引用の際は、引用したサイトを記述するのが決まりのようです。

そんな最中、地獄変00様のサイトを見るとblockquoteとFieldsetに関する記事を!∑(゜∀゜)
個人的には、結果が同じならfieldsetでもいいかなと思いましたが、民主主義なstyleで実現しようかと。

枠線をつける場合のスタイルシート定義

style blockquote { position: relative; padding: 0.5em; border: 1px dotted #399; color:#399; }

blockquote div.qtitle{
display: block;
position: absolute;
top: -0.5em;
left: 1em;
z-index: 1;
padding: 0 0.5em;
background-color: #FFF;
color:#399;
font-weight:bolder;
}

で、使用する際は、↓のようにすると。
<blockquote><div class="qtitle">引用</div>
<p>この文章は引用しています。
</p></blockquote>

From http://blog.livedoor.jp/jigokuhen00/

あぁ、htmlタグは、奥が深く、悩ましい・・・。