bloggerの引用（blockquote）をかっこよくする！

引用として書いてるのに、なにか味気ない。。
ということで、以下をcssに追加してかっこよくしました。

blockquote {
    background-color : aliceblue;
    border-style : dotted;
    border-color : lightskyblue;
    border-width : 0.1em;
    padding : 1em 1em 1em 3em;
    position : relative;
}
blockquote:before {
    content: "\201C";
    font-family: 'Times New Roman' ,"ＭＳ Ｐゴシック" ,sans-serif;
    font-size : 500%;
    line-height : 1em;
    color : lightskyblue;
    position : absolute;
    left : 0;
    top : 0;
}

ローマは一日して成らず

ちなみに、参考URLは以下です。

【保存版】引用 (blockquote) CSSデザインおすすめコピペサイトまとめ

blockquoteタグをCSSだけで格好良いデザインにする【画像不要】

Awesome Blockquote Styling with CSS

content:に指定した"\201C"は秀逸。しばらく文字化けと格闘したので。