WordPress 備忘録3 引用の装飾

WordPressの引用は字下げだけの愛想のないもので、引用なのかどうか見分けがつきにくいと常々思っていました。

引用が引用として分かりやすいように、装飾をする事にし調べると「Wp-None」と言うプラグインもあるようでしたが、直接スタイルシートに書き加える事にしました。

MTカスタマイズ法収集ブログさんの「引用部分の装飾」を参考にさせて頂きました。

blockquote {

background-color: #FDF7E3; ボックスの背景色の設定

border: 1px solid #CC9966; ボックスの外側の線の太さ、種類、色の設定

margin-right: 5px; ボックスの外の右端の余白の設定

margin-left: 7px; ボックスの外の左端の余白の設定

padding: 3px; ボックスの内側の余白の設定

}

となっていました、これを元に一部変更して

blockquote {
background-color: #293036; ボックスのバックグラウンドカラーの設定
border-left: 15px solid #616571; ボックスの左側の線の太さ、種類、カラーの設定
margin-right: 5px; ボックスの外の右端の余白の設定
margin-left: 40px; ボックスの外の左端の余白の設定
padding: 4px; ボックスの内側の余白の設定
}

blockquote {

background-color: #293036;  ボックスのバックグラウンドカラーの設定

border-left: 10px solid #616571;  ボックスの左側の線の太さ、種類、カラーの設定

margin-right: 5px; ボックスの外の右端の余白の設定

margin-left: 40px; ボックスの外の左端の余白の設定

padding: 4px; ボックスの内側の余白の設定

}

テーマのスタイルシート(style.css)の何処でも良いので書き加えました。


COMMENTS & TRACKBACKS

  • Comments ( 0 )
  • Trackbacks ( 4 )

コメントはまだありません。

  1. ブログにエントリ: WordPress 備忘録3 引用の装飾 – WordPressの引用は字下げだけの愛想のないもので、引用なのかどうか見分けがつきにくいと常々思っていました。引用が引用として分かりやすいように、装飾を… http://tinyurl.com/ykt2cln

  2. WordPress 備忘録3 引用の装飾 http://ff.im/-buQNQ

  3. Blog entry : WordPress 備忘録3 引用の装飾 – WordPressの引用は字下げだけの愛想のないもので、引用なのかどうか見分けがつきにくいと常々思っていました。引用が引用として分かりやすいように、… http://tinyurl.com/ykt2cln

  4. […] 『酔いどれオヤジのブログwp』さんの記事を参考に、Twenty Tenのstyle.css内『blockquote {』から始まるところを、以下のように編集。 blockquote {  background-color: #F0F8FF;  border: 2px dashed #008B8B;  marg […]

LEAVE A REPLY

*
*
* (公開されません)