20 Macam Blockquote Keren Untuk Blog

20 Blockquote Keren ini semoga dapat memperindah tanpilan blog kalian semua.

Cara Pasang BlockQute keren di Blogspot

1. Login ke Blogger

2. Masuk ke Rancangan ==> edit HTML

3. Download dulu template anda, untuk menghindari kesalahan

4. Centang expand template widget

5. Cari kode tekan CTRL + F   .post-body blockquote  atau  .post blockquote 

6. Jika sudah ketemu, ganti  .post-body blockquote   atau  .post blockquote  dengan kode yang anda inginkan dari ke 20 macam Blockquote ini.

7. Simpan template

20 Blockquote Keren

Gaya 1

Blockquote Code :

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

 Gaya 2

Blockquote Code :

.post blockquote { margin: 1em 2em; border-left: 1px dashed #999; padding-left: 1em; } blockquote p:first-letter { float: left; margin: .2em .3em .1em 0; font-family: "Monotype Corsiva", "Apple Chancery", fantasy; font-size: 220%; font-weight: bold; } blockquote p:first-line { font-variant: small-caps; }

 Gaya 3

Blockquote Code:

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

Gaya 4

Blockquote Code

.post blockquote { background-color: #666; color:#fff; padding: 15px; margin: 1em 40px; -moz-border-radius-topleft: 15px; -webkit-border-top-left-radius: 15px; -moz-border-radius-topright: 15px; -webkit-border-top-right-radius: 8px; -moz-border-radius-bottomleft: 15px; -webkit-border-bottom-left-radius: 15px; }

Gaya 5

Blockquote Code :

.post blockquote { margin : 0 20px; padding: 60px 30px 40px 20px; background : #F1F8FE url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVQrqQwnqR1J1BbSoStFmm9bhnB9t1_xGXv3yD6wJh3qDBIw04QLG723KgUyo3bzBhjpcYp-QT6Z3jx1z0sito5_2-HxsrZoHkyB3t9N_pXxCZDdkrxipqc6lHVc_prmrVXUwJAoSo_gk/s400/owl.png) no-repeat 350px 5px; font: normal .9em "comic sans ms", Courier,"Times New Roman", Times, serif; color : #000; border-left: 8px dotted #DAB547; } blockquote p { margin: 0; padding-top:10px; }

Gaya 6 

Blockquote Code:

.post blockquote { margin : 0 20px; padding: 70px 20px 20px 40px; background : #E4EAFE url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjEudj8RKya62b-SG81Nt9gMu3b_eV4JpkSJGxltOqFqyeBth_T0-QLxHNleukDnyu-oZWu7FF1qK5vQvLN27M2IQ0VPxXymiQdW8Vf3uvbFLbj2yizOrJxaoq45fIs31ngf15Ku4UQM-4/s400/angular-purple.gif) no-repeat top left; font: bold 1em Helvetica, verdana, Georgia, "Times New Roman", Times, serif; color : #000; border-bottom : 5px solid #435388; } .post blockquote p { margin: 0; padding-top:10px; }

 Gaya 7

Blockquote Code:

.post blockquote { margin : 0 20px; padding: 10px 20px 25px 20px; background : #9FCFFF url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjaznK6We53XEO6Zy3cJ2SzAmkSOLmopGndeDbj7k4Y0ljRmCMrj57aONf0OeFVMjPLa5GFB8MqfAWQatGajOtsdgxBnxwyk6TfohZs9s6l2vuxa1NaqqpAJ_INyED1TXsGYN1SBAB-HGw/s1600/block22.gif) no-repeat right bottom; font: bold .9em "comic sans ms", arial, Helvetica,verdana, Georgia; color : #484848; border: 5px dashed #fff; } .post blockquote p { margin: 0; padding-top:10px; }

Gaya 8 

Blockquote Code:

.post blockquote { background: #F3F3F1 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhGkax_TPs1YWRHh-GkS6X7Hx0kd4TBF9JKxcmWmAjMv9aPdkxi75rOA3z9CIBbI43Fox3VyHqC_KHmkWYfYpbrE6_jQ3nLdCFqViwkX-qAR31CMHrtClWJ2PTbyjpIqntVpA1KzfNT2Eo/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; }

Gaya 9

Blockquote Code:

.post blockquote { background: #484B52 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjupfWhMpY6IpGII0DKSNTq0SQFfFVn_UcqXowxImG4xiiNxMKafLrAoCQeHYlAHDalpBVj2XDkgsejeVbK4dRq_iBTWixxv0cLChGra8LdlBzR0jnzCHWFazAT56bm4eVDOw-iqjJHUYs/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; }

Gaya 10 

Blockquote Code:

.post blockquote { margin : 0 20px; padding: 20px 60px 80px 20px; background : #FEE4E3 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh_8ElJOp8ltoY8UgYXWKzRysNmVmZmMWgRRwU-ci_9EQvoOOvypksVstzabixKe7REBBJJm8SrwneC76VGeZYpXbz8A3_1K1vqDNZte9rNJV2q63upgArG2VYsrZMSvAy5vE63Ligy1XY/s400/angular-right.gif) no-repeat bottom right; font: bold italic 1em Georgia, verdana, Helvetica, "Times New Roman", Times, serif; color : #000; border: 1px solid #DDD; } .post blockquote p { margin: 0; padding-top:10px; }

Gaya 11 

Akan ada akhiran seperti ini

 Blockquote Code:

.post blockquote { font: 18px normal Tahoma, sans-serif; padding-top: 10px; margin: 5px; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgBdeE0YLuq9YQoJpSw7vx2y9h8R7Pn5IMk-NuLWDsL27ngHXScxS_ISUm1Ri7hK2ciwbIi7aYqhy4wONsyDy2J0tedmGk1THOyUnnXw0SF1geV62B3BYE3sfTgHVF34CJiseaa3OaOVFA/s400/comma-left.gif) no-repeat top left; text-indent: 65px; } .post blockquote div { display: block; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_5Gbkd4htPQkc87Yq8QreVacU6wqIl3o9vowtZ-Q0ZAqBwO8pSJC1NxhCxK87q1-bC7yNYKdFAxZAoQx7gycVp9Gc2nS0YLh67xbyAU6J0mnVa6x2GX2MZo5v3maX7-myeNTQNH0iUq0/s400/comma-right.gif) no-repeat bottom right; padding-bottom:10px; } .post blockquote p { margin: 0; padding-top:10px; }

Gaya 12 

Akan ada akhiran seperti ini

Blockquote Code:

.post blockquote { font: 18px normal Tahoma, sans-serif; padding-top: 10px; margin: 5px; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh-2XjoOWy1sTOkrPN20HoZnSPnBSWEa3yresDkYpM4LCFN10SPpsTVlfEx9ult1-v-jXYCaFhemTqpQW7k74HJK2oSferJjCjyy6gMprY6RdZernq5LFsBk8_96L0aC7neca2VO5B0mvY/s400/comma1-left.gif) no-repeat top left; text-indent: 65px; } .post blockquote div { display: block; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzCmhNCOArPAD8gCa-C-vx-M-QjDUfo9xFb8UBRsFG9Cx5MlWFvPZoEo7qhl9pgaTOIed3dzkV4dtWb_tUvLDh9-LZZhS1qCyHbcLBIVAJu8K4CMNaLD-FYjjmz6D-P5zrLccWq-B4HFs/s400/comma1-right.gif) no-repeat bottom right; padding-bottom:10px; } .post blockquote p { margin: 0; padding-top:10px; }

Gaya 13

Akan ada akhiran seperti ini

Blockquote Code:

.post blockquote { font:bold italic .9em "comic sans ms", Tahoma, sans-serif; padding-top: 25px; margin: 5px; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKMGoRGFRtQm2qeLLI4d3Fyxj7oGVHIKNZwOcW6E5t6lp39AsUEJrNYmh_qFh524C1-fyR60GqpuijcpcU8-0ql3aDhNofk3VyIGV7vXoCCyVfu4OjgRCR9LMWuFi0UmiCyMUES1nBioI/s400/left.gif) no-repeat top left; text-indent: 65px; color:#6299E4; } .post blockquote div { display: block; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvnmkZQLgu0xyF46ucdSrFf3_gBBTaZab-sy_TY72Pe1SC6GT1LziRV-31xZ1Gr6LOcvw9JYo0jr1Q8o-dJzQROrtXGBVXZFmIrYMj-AU73nQyMPPc_Do7BvOatJEXHkunK8ucH4k1tw0/s400/right.gif) no-repeat bottom right; padding-bottom:30px; } .post blockquote p { margin: 0; padding-top:10px; }

Gaya 14 

Akan ada akhiran seperti ini

Blockquote Code:

.post blockquote { font: italic 1em "comic sans ms", Tahoma, sans-serif; padding-top: 10px; margin: 5px; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEju_mqJlDpu5LRHeeceEyo0Zo329sqdlI2uEQKy6W1yD1nefdlW9ibR8NASQlsTg_lwIZGEiqW_ODVP-zvqGdQqZ6GcpWiGpQzLliUv3_r2jmnMa-iGQkDQBN66e6wVLhSYDF9gc_ygDFQ/s400/comma2-left.gif) no-repeat top left; text-indent: 65px; } .post blockquote div { display: block; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgRqQAo6-glIHY6HGfqUpGwwbZRUxwPG2T48rOb0o2R0ytabo_UC4d1-UlV8cMHn5c12oG3_tSe6ZJwMWlxeboVD_6rjc_830s6Mau6RMwYrWhSnhDrez4msmGZfn4V12HLq-OdvnlJh20/s400/comma2-right.gif) no-repeat bottom right; padding-bottom:10px; } .post blockquote p { margin: 0; padding-top:10px; }

Gaya 15

Akan ada akhiran seperti ini

Blockquote Code:

.post blockquote{ margin : 0 20px; padding: 50px 30px 50px 30px; background : #FFF url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi-OOlsQfQQBMPUp88_kozZqyHuzZcMliragEyxy7fi-md8tn_oa5mCLSP5h4anxPS2DEUG2C_ZGaiSaSERu31X-obgKxHd3ETqTaNlkQ8p7dPe1YbeElRDk4-XV_G_x4QIe56zwNpR1MY/s1600/BLOCK1-TOP.gif) no-repeat top; font: bold italic 1em Helvetica, verdana; color : #000; } .post blockquote div{ background : #FFF url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiyQ-nOXau_JzXy1vhCfOgKDeTWpCJaEs5JiDD7uDCHr7sojys_t0gM5BvcIxyl891Oie1zSrSEFzQevDPiXvzHpcm3PU85X8tDvUC27k-AhmMykI_nN1SkOjLy2yzwUZs_0OZF2CH2oPI/s1600/BLOCK1-BOTTOM.gif) no-repeat bottom; padding-bottom: 50px; } .post blockquote p { margin: 0; padding-top:10px; }

Gaya 16

Blockquete Code

.post blockquote { margin : 0 20px; padding: 70px 20px 30px 20px; background : #E7E5DC url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjAtYtQ3OTR6OVP7jmeJY0te3rcTc9twwCPdX7Su-0kUAZcSMmEdkx-bChA0v9GmhHbaAmv0_79SRwdVpZn0xnMLUcnNOcDHmjdaE0ciWR58o5GQhZfTgQOyRGRRVN0mqQnGyzVHUeiAvs/s400/block3331.gif) no-repeat top; font: bold .9em Helvetica, "comic sans ms",Courier,"Times New Roman", Times, serif; color : #343434; border-left : 7px solid #FF7802; border-right : 7px solid #FF7802; border-bottom : 7px solid #FF7802; } .post blockquote p { margin: 0; padding-top:10px; }

Gaya 17

Akan ada akhiran seperti ini

Blockquote Code: 

.post blockquote{ margin : 0 35px; padding: 80px 0px 0px 0px; background : #E6F1FA url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGXGA8qSBQb8zrBywnyqzsFu-5vYf5k3K0GJ9BqC65yLyjJ6uc1880liCWfVvlIpe-9rU8HyyRy7wrUUj7ylvSsUn_ZCaS-TeIZkNpIlYwociVpsSuReu5dalH7jL3hju23n1Y5u-OhGU/s400/head2.gif) no-repeat top; font: normal 1em "comic sans ms", Helvetica, verdana; color : #666; } .post blockquote div{ background : #E6F1FA url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg9FC3Frza7bGeO6zGZWW5xQI7Ngu1SatcwYr3uYfSrzgrj38J9MO8U27AXs7Mibuip9xnf7rAL9x8J6euhcOORMGpOEPvoMnPpqBtpc4iNlvOFbWU2ak9Z-NMETw1M1g6rTeTm8xTtTOA/s400/head-bottom3.gif) no-repeat bottom; padding-bottom: 50px; } .post blockquote p { margin: 0; padding: 20px; }

 Gaya 18

Blockquote Code :

.post blockquote { margin:1em 20px; } .post blockquote p { margin:.75em 0; } blockquote { background:#EFEFF7; }

Gaya 19

Blockquote Code:

.post 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/AVvXsEiMKImLEHl61QcS5jLbbxkDNFIdoq8eJxr0RG7SzVKNB3bq3_T0Li5wjnBzr4Gcvz4hY85dG4IflxREQahNCXpzo3l35HzA910VzmS3tVd5x0I2oaAGCdgMit9bb9f1Rv3srMzpzX5MSQva/s1600/quote.png") 5% no-repeat #FFF8DD; }

Gaya 20

Blockquote Code:

.post blockquote{ background-color: transparent; border-top: 3px double #DC143C; border-bottom: 3px double #DC143C; paddin