8 style Blockquote blogger keren

Pada dasarnya blockquote yang kita gunakan dalam postingan blogspot tidak ada yang aneh, nah mau yang aneh dan lebih unik yuk kita telusuri bagaimana cara untuk memperindah blockquote blog  ALA gaptek32.

Langkah pertama masuk pada blogger yang ingin sobat pasang blockquote, pada layar dashboard pilih Edit HTML lanjutkan kemudian centang kotak pada bagian pojok atas kiri.

• Style 1

blockquote { margin: 1em 3em; padding: .5em 1em; border-left: 5px solid #fce27c; background-color: #f6ebc1; } blockquote p { margin: 0; }

• Style 2

blockquote { margin: 1em 3em; color: #999; border-left: 2px solid #999; padding-left: 1em; } 

• Style 3

blockquote { background-color: #666; color: #fff; font-weight: bold; padding: 10px; -moz-border-radius: 5px; -webkit-border-radius: 5px; }

• Style 4 

.post blockquote { background: #F3F3F1 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhm-djFwJXdMUhQN20R19aBhlel-oIRYOrFDjbE_ejUGD8qbbMPch0Wt7OwyI-r-I4eQu3rodGW_tEBN09YGQ_A5xNmTPgioJ2GmABD30RU7yhcQgMIS5laZrYyeT9HGQlZt4_YTHvs8Yk/s1600/comma-side-orange1.gif) ; background-position:; background-repeat:repeat-y; margin: 0 20px; padding: 20px 20px 10px 45px; font-size: 0.9em; font: italic 1.2em Georgia, "Times New Roman", Times, serif; } .post blockquote p { margin: 0; padding-top: 10px}

• Style 5

blockquote { background: #484B52 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhooUEUFK-Gnknrhz1XHSHP-0PERkMf1ye-bJ1Gi433g-H3P43eOcrKaEZKwsR-tKIWfq-zf1P0M-7wCgdtNQk9sUvqvoN0L9TodAXDG-A2xDppqbYekWRkN0N41dN2nxjFYYfb8J350Eg/s1600/green-black-side.gif) ; background-position:; background-repeat:repeat-y; margin: 0 20px; padding: 20px 20px 20px 50px; color:#C7CACF; font: normal 0.9em Helvetica, verdana, serif, Georgia, "Times New Roman"; } .post blockquote p { margin: 0; padding-top: 10px; }

• Style 6

blockquote { background-position:-10px -7px; border: 1px dashed #FFC600; margin: 20px 10; padding: 0 20px 0 50px; background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjo8hrLXnVgyyNj0S_76FQQKMYvqbItiz4qkEDNH7YC6fh1NZnS3nB0L9IU79X45Of7hLk9gXkrn7wKI0yBWlYtu4tPG19IhEl4Zkme2kdEpmQTD_QyMS8k5X1oLdtwCz8HKUkFeocJ8B96/s1600/quote.png") 5% no-repeat #FFF8DD; }

• Style 7

blockquote{ background-color: transparent; border-top: 3px double#DC143C; border-bottom: 3px double #DC143C; padding: 5px; font-style: oblique; font-size: 1em; margin-left: 5%; margin-right: 5%; }

• Style 8

blockquote {font-family: verdana, arial, sans-serif;font-size:small;color:#FFF;line-height:140%;background-color: #333366;border: 4px dotted Olive;padding: 5px;margin-left: 15px;margin-right: 15px;width: auto}

Setelah selesai dengan pilihan blockquote, masukkan salah-satu kode yang di inginkan di atas tepat di atas  ]]></b:skin>

Semoga artikel oleh gaptek32 ini dapat membantu sobat yang sedang memperindah postingan blognya dengan blockquote.