旧型の blockquote + CSS でやるならこんな感じ?
[CSS]
body {
background-color: #FFF;
color: #333;
}
blockquote {
position: relative;
padding: 0.5em;
border: 1px solid #333;
}
blockquote[title]:before {
content: attr(title);
display: block;
position: absolute;
top: -0.5em;
left: 1em;
z-index: 1;
padding: 0 0.5em;
background-color: #FFF;
}
[HTML]
<blockquote title="と××のスタイルシート入門">
<p>引用に fieldset とは、いやはや盲点でした(^^;</p>
</blockquote>
手持ちのブラウザでは Opera 7.23 でしか上手く逝かん。Mozilla は content で生成された要素の position 指定が効かないっぽくて、これって不具合だと思うのだけどどうなんだろ。
追記。上記の方法は Opera の勇み足サミー(←年がバレるよな……)みたいなので、別手段を考えてみた。んでも汎用性はほぼゼロ。
[CSS]
body {(略)}
blockquote {
margin-top: 1.5em;
padding: 0.5em;
border: 1px solid #333;
}
blockquote[title]:before {
content: attr(title);
display: block;
width: 6em; /* この値をいちいち変えないといけないのがダメすぎ */
margin-top: -1em;
padding: 0 0.5em;
text-align: center;
background-color: #FFF;
}
[HTML]
<blockquote title="四季 冬">
<p>貴女は貴女から生まれ、貴女は貴女です。そして、どこへも行かない。</p>
</blockquote>
北村 : Mon 22, 2004 21:00
こちらにははじめまして。
生成内容にpositionが効かないというのはCSS2の仕様のようです。
http://www.w3.org/TR/1998/REC-CSS2-19980512/visuren.html#propdef-position