Blockquoteタグで囲った部分の表示を変更する

私のテンプレートをダウンロードすると
何も手を加えない状態ですと

blockquoteした部分の表示は
このようになると思います

が
それを

このように表示させるようにカスタマイズする事が出来ます

方法は以下の通り CSSファイルの中に↓のような部分がありますがこれを
（CSSファイルのかなり下部のあたり）

/* Blockquote
------------------------------------------------------------ */

blockquote p {
color: #999999;
font-size: x-small;
width : 90%;
margin : 2em 0;
padding-top : 0.5em;
padding-bottom : 0.5em;
padding-left : 10px;
background : transparent url("http://blog6.fc2.com/f/ff12expo/file/block-gr.gif") left top repeat-y;
}

↓このようにする事で
blockquote部分の表示を
このように変更させる事ができるのです

/* Blockquote
------------------------------------------------------------ */

blockquote p {
color: #999999;
font-size: x-small;
width : 90%;
margin : 2em 0;
padding-top : 0.5em;
padding-bottom : 0.5em;
padding-left : 10px;
/*background : transparent url("http://blog1.petitmall.jp/c/chanu/file/block-gr.gif") left top repeat-y;*/
border-top: 1px dotted #CCCC99;
border-right: 1px dotted #CCCC99;
border-bottom: 1px dotted #CCCC99;
border-left: 5px solid #CCCC99;
}

枠の色を変更するには
緑色の部分を好きな色が出るように変更して下さい
色の番号はこちらで確認できます

人気blogランキング参加中