LINEで送る
Pocket

「言及リンクのないトラックバックはお断りします。」的なブログが多いような気がする。

まぁ、大半がSEOを目的として、関連性のない記事に一方的にトラックバックを送信してくるような、ブログが多くなってきたための対処ということなのでしょう。。。

しかし。。。なかなか言及リンクって言われてもねぇ。。

要は、トラックバック元の記事にトラックバック送信先のリンクがあればいいわけですが・・・
それだけじゃぁ味気ないので・・・

どうせなら、大々的に引用したろう。っちゅう結論に達しました。。

「オールスターという夢のドリームゲーム」、「1年目のルーキー」、「今年初めての開幕戦」、「体験を経験」、「疲労からくる疲れ」、「秋の秋季キャンプ」、「始まりのスタート」、「バースデー誕生日」、「打率のパーセントテージ」、「ブルーな青空」など・・・

ウィキペディア 長島茂雄のページより

例えば→のように書いてしまえば、このブログの文章ではなく、リンク先の文章っちゅうことが一目で分かりますよねぇ。。

しかし、すごいですなぁ。。。長島氏。。。神いわゆるゴッドですな。。←(あ。。これも引用せなあかん?)

とにかく・・・こんな風に書いておけば、読者にも、引用された文章を書いた筆者にも印象がよさげ?

っちゅうわけで、今回使用しましたCSS(スタイルシート)、html、イメージファイルをご紹介。

CSS(スタイルシート)

.quote_block {
float: right;
margin: 10px;
padding: 10px;
width: 250px;
font-size: 12px;
background: #F9FFEE;
border: 1px dotted #99CC33;
}

.bqstart {
float: left;
margin: 0 10px 5px 0;
padding: 0;
width: 35px;
height: 25px;
background: url(images/bqstart.gif) no-repeat;
}

.bqend {
float: right;
margin: 0 0 5px 10px;
padding: 0;
width: 35px;
height: 25px;
background: url(images/bqend.gif) no-repeat;
}

.quote_block blockquote {
margin: 0;
padding: 0;
}

.quote_block p {
margin: 0;
padding: 5px 0 10px 5px;
}

.quote_block cite {
float: right;
margin: 0;
padding: 0;
font-size: 10px;
font-style: normal;
}

html

<div class="quote_block">
<div class="bqstart"></div>
<blockquote cite="引用先URL" title="引用タイトル">
<p>引用文</p>
</blockquote>
<div class="bqend"></div>
<cite class="cite">
<a href="引用先URL" target="_blank">
引用タイトル
</a>
</cite>
</div>

イメージファイル(↓のイメージを保存してくださいな。)

bqstart.gifbqend.gif

Similar Posts:

LINEで送る
Pocket


0 Thoughts on “CSSで引用をデザインする。”

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です