blockquote で引用元をどう表示するか
Posted by yoosee on Web at 2006-10-23 23:42 JST1 Firefoxで選択できないテキスト - enbug diary (2006-10-23)
blockquoteにおいてciteやtitle属性で指定したテキストが、 表示はされますが、選択できません。 Firefoxで選択できないテキスト - enbug diary (2006-10-23)私は例えば以前はこんな css を書いていた。
blockquote[title]:before{ display: block; font-size: smaller; color: #777; border-bottom: 3px double #777; content: "Quoted from "attr(title)"" } blockquote[cite]:after{ display: block; text-align: right; font-size: smaller; content: "uri: "attr(cite)"" }しかし css の content には html が書けないため、hyperlink を作る事ができない。ブラウザによっては表示されなかったり文字選択できなかったりと、あまり嬉しくない。と言うことで使わなくなってしまった。
今はというと冒頭の引用のように表示されるわけだが、これはblockquote の cite と title 要素を指定した上で、更に blockquote 内に更に cite 要素 を書き込み、そちらを Hyperlink にするというまわりくどいやり方をしている。この引用部分の html は例えば以下のように記載される。
これ自体は Firefox の CopyURL+ extension を使い、user.js に以下のように設定をいれて自動生成している。<blockquote cite="http://example.com" title="Quote先のタイトル">
<p>引用本文
<cite><a href="http://example.com">Quote先のタイトル</a></cite></p>
</blockquote>
user_pref('copyurlplus.menus.1.label', 'Copy as A link'); user_pref('copyurlplus.menus.1.copy', '<a href="%URL%" title="%SEL%">%TITLE%</a>'); user_pref('copyurlplus.menus.2.label', 'Copy as Quote'); user_pref('copyurlplus.menus.2.copy', '<blockquote cite="%URL%" title="%TITLE%"><p>%SEL%<cite><a href="%URL%">%TITLE%</a></cite></p></blockquote>');あまりスマートでは無いので、多分 JavaScript で blockquote の cite, title から自動成形してしまうのが一番賢いのではないかと思う。そのうちやるかも。w3m などではリンクが消えてしまうのが難点か。
ちなみに cite 要素は css にて
blockquote cite{ display: block; text-align: right; font-size: smaller; }として右寄せ表示している。