blockquote 引用ボックス


スポンサーリンク

引用の飾り

引用は、検索エンジンに対して、本サイトのコンテンツではないことを明示する。
それを前提に訪問者に対しても他の本文とは違うことを意識づける。
 
引用本文

引用元


 
HTML
<div class="inyoubox">
<blockquote>引用本文</blockquote>
<p class="origin"><a href="http://dummy" target="_blank">引用元</a></p>
</div>

 
CSS
/*----------------------------------------------------------- */
/* 引用ボックス */
/*----------------------------------------------------------- */
.inyoubox{ background: #e0e0e0; }
.inyoubox blockquote {
	padding: 10px 10px 5px 10px;
	color: #212121 ;
}
.inyoubox p{
	margin-bottom: 12px;
	font-size:10px;
}
.inyoubox p.origin {
	background: #9f9f9f;
	text-align: right;
	padding: 5px 10px;
	margin-bottom: 0px;
}
.inyoubox p.origin a {
	padding-left: 15px;
	color: #666;
}

 

スポンサーリンク