[部落格]修改CSS語法:『blockquote』(引用段落)

對於部落格中的CSS屬性，有一個標籤叫『blockquote』即『引用段落』的html標籤，一般只要編輯文章的畫面就能直接點擊使用，其目的是為了把文章中一些重要的段落句子用「高亮」的方式來呈現，而有些部落格原本內建的『blockquote』很不好看，故可以透過修改CSS語法的方式來讓它好看些。

只要是CSS語法都可以套用在各種部落格上，如Wordpress、痞客邦、Google Blogger。

列出兼筆記一下微微足道常用的語法，以下為範例，可複製下來自己再修改邊距、字體、背景色等等:

■CSS語法1:

blockquote{
     margin: 20px;
    padding: 10px;
    background-color: #eeeeee;
    border-left: 5px solid #00aae1;;
    margin: 15px 30px 0 10px;
    padding-left: 20px;
    border-radius: 6px;
}

↓效果1:

眾鳥高飛盡，孤雲獨自閒;相看兩不厭，只有敬亭山。

■CSS語法2:

#blockquote {
    background-color: #FFFFBB;
    padding: 40px 0 10px 40px;
    border: 3px dashed #ccc;
}

↓效果2:

眾鳥高飛盡，孤雲獨自閒;相看兩不厭，只有敬亭山。

■CSS語法3:

blockquote2 {
    display: block;
    font-size: 15px;
    line-height: 1.6;
    font-style: italic;
    color: #666;
    background-color: #FFFFFF;
    padding: 15px;
    border-left: 5px solid #00aae1;
    border-right: 2px solid #00aae1;
    box-shadow: 2px 2px 15px #ccc;
}

↓效果3:

眾鳥高飛盡，孤雲獨自閒;相看兩不厭，只有敬亭山。

以上的對Blog的CSS語法修改其實不難，只要稍懂CSS語法就能看的懂本篇在說什麼，而語法修改要的套用就看個是要用#ID的方式或是直接用Class或是直接全局的<blockquote>修改，就端看個人了!!!

▼全局的<blockquote>修改
<blockquote>
    <p>
        眾鳥高飛盡，孤雲獨自閒;相看兩不厭，只有敬亭山。
    </p>
</blockquote>

或是

▼用ID方式對<blockquote>套用
<blockquote id="blockquote2">
    <p>
        眾鳥高飛盡，孤雲獨自閒;相看兩不厭，只有敬亭山。
    </p>
</blockquote>