Style Cantik Blockquote untuk Blogspot dan Website

Publish Date : 15-10-2016 , dibaca 2182 kali, Hari ini dibaca : 1 kali ,0 comments

Tutorial kali ini admin akan Share Cara Merubah Style Blockquote Untuk Blogspot maupun Website, Gaya atau desain tampilan website sangat berpengaruh terhadap minat pembaca , begitu juga dengan tag atau komponen Blockquote yang sering digunakan dalam penulisan artikel, sebagai pemisah antara code / artikel yang dikhusukan dari artikel di dalamnya .

Gaya Style Elegen dan Cantik Blockquote Untuk Website / Blogspot

Untuk merubah gaya blockquote , disini kita menggunakan style CSS, makanya pada judul artikel saya menulis blogspot dan website HTML, karena pada prinsipnya sama saja , baik itu di website PHP MYSQL / HTML , maupun blogspot

Berikut style cssnya :

/* CSS blockquote */
blockquote{font-family: Georgia, "Times New Roman", serif;margin:0px;color: #b4b4b4;font-weight: 400;line-height: 20px;font-style: italic;text-indent: 65px;position: relative;background: #fff;border-left:3px solid #f8f8f8;padding: 20px;}
blockquote:before{content: '\201C';position: absolute;font-size: 85px;top: 25px;left: -45px;color: #3498DB;}
blockquote:after{content: '\201D';position: absolute;font-size: 85px;bottom: -10px;right: 25px;color: #3498DB;}
blockquote p {display: inline;}

Untuk hasilnya seperti berikut

blockquote style css3

 

untuk demo silahkan lihat disini : disini

Produk Rekomendasi

Artikel Terkait

Diskusi



wa