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/AVvXsEjVybEc1iSDDYV8tCqxmocEGSjnKDO6ok8AkduIh4AGIkY9-oaciJ_s4lAAfjvd4YZ3fEuA2IrNo-sOXkXU-RWJ1JQb55DUpaO589d1nH91ZnaXZWHxRj0XfW48Q0q1Z_gCO3MHtQCxJbs/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/AVvXsEimRvDf5qQ2jZ0un2qOJWwSktQoHA65d8mrA6APiS6uZxV7B1wDpaOCS2xtfxj5S9p2Cm8KMro_pL1UKVeyUAONvcqQJkngL9X0jokCmbRZ0_aRD4a0tBQjJny2y1FubsabUY-yhag38Sk/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/AVvXsEjFRqtR7V-5_npfBD-jazsT4-4b0vowhREepcuO7Vra-MvnmX2gU0SAuPlqMtlet74QHrRUJmN-DFM5LLURZXig_f8VmUcI9DuiRzR2DRYehpYf3P7Q83S4dGryZi7YlW0ar3bC7C-Wk1w/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/AVvXsEgZZUXrIdy3uvwqTtlmxt-QXm9T7upAP1s9F4jmJufDYmdsO_9MVeag8KivbQZELkQq4GrJAPEM95SAZ1CjHlV5P3ovL3GWB0kiBA7b8UF17nAXSRC5qpmFSori89MtnsvWv1XYttQxg_8/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/AVvXsEg3AfKSzJa6PCVdrqOIcjoqrjPKbABb64ykSw-et4_ewro-GCEgtQbs2Q7Wz5YAtP_UqsoT581G3_TM3Y1FWKCD51mIDcJoWRCgY2Bv9NkpHydXCwUyWXyKkb7nEjZaSj8PpqhrMAJTvIA/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/AVvXsEiZpUsfvCX2YamE9dN0gFJUgzG9XS7QXz4vTfcqjLUx5DP0o3otc1m1V_EU8DY9BS1tkEeFfYHiej5ZFSf55HqWoG_ER3Zg4T8Ky6Vu8FCcNvCCTXUUJt5ceZ2sonDn7YznPD449yEcqhY/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/AVvXsEirZX_0gyiJ0s81SyEsq0i52xF9DBU-qXoPCCdi9_jiVicTb0qpkzvMz-g2soKOFHcPmMnwrObFCxJIp3lj7JfNujGaVKJOEwM-heJ6asA_BKN19XEyX60e0w-DPIFlHjXRyqPhLBxRK8M/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/AVvXsEi1jXlElJMlZmNHMaLvoH0yMm_BZRPONYtnfRvmt-8W55POHbB9wO7kLYjacJAhdBaK7n-oCmCYrRTXosLaGWW2PAsmetHCoe6OAYmS5ESuJU7-391_KNMV7HNnqmW1nBMY9t5_NnTb1T0/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/AVvXsEhx1BpjXDDY4dxjnDEDNUory7i-AaR7uCSA4s1tDQVtDKso9h32tAV4Ptb81veR3AIrNAId9Ke2diHBDf9Er_3cnDovZl3_0bIT9Oz8yfo7CxZ7iLyfZaSXB20vVyQlG-XcwbN5iYftLoM/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/AVvXsEgvY9Swjp5Ar0LP4be0gwS8K6T3dhaf4J3IyqIDlAHfhSR5THy6rHtmXP4gqeZzZgFU0MA3lIGB6Gu2Or-JydSemFHQwp5Mezyw3-Fqc17tlrZFQJbZDql3exIaqPZiRSxtfAaeCEEt7XQ/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/AVvXsEiN3AjHtsWjw_E5TDWxdmVTeoaqy9-pfuKMrKkWOzwbkPeJ8wyLDDfZMX9K630kSIF8ZwgqRvti4-qThQXlXRuKc07cPuTvDzs4aHl95DAEJNG4jXoqJ1utp4YAoomsAjaWS1no7ygm0IU/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/AVvXsEj3h7H8i9Bgl2mDyWRzW8yA3arHgZqJGFsjsJ5un7IJS0zGP1hH7lvJxJ9Obn2_NXlzJD7mAK3IyES827pzXyHM73jKcd2NIo0k0bkZJzDxD989zkSDiG9g5OE9Ts8p5ZOlUR5gLsTPU4Q/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/AVvXsEgah06fGftJAXbUkys7i-xOWxGH9jw_vru3-Rm4wgm82099O2j008glBMWyZT0L7aS5s0Ne03zVY7Kv4AaAQNGxJYfb-l2PtF1OcbbDuJ5b9BxNzZOV_7ozUr94xEyX_zwQe79cN6lIDKI/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/AVvXsEjBrhirJDVg61TPhnp1ADCkDoAz5L7Dc_ajouJfRyt-Nt_LVLFFwekSumgZn4g9Ltq4NSZTaO9F4rGoXq666dec0k1qyPZsMqK9yATYN-YWR7_vVGsCgijmvHwG9cildTyckhPvlPw4jwU/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/AVvXsEjFMRMp2_JX0JawlXvdMGPLygUTkQjFhOfuE-NsEa14rXdI8Sw-f2847r90Xh_A70TxLC3YGniwV4E0fh51hxkvB9oZBQpDvZC69hKJjYwJO0ptuWApTIS1YDPlsuCqngWtt5DT6NKC1jI/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/AVvXsEioNz11_gzBidGEpLxQYlPdgLTE0AKMyXlcefGxFh6h7pdsObnbP1YBMzTjcEehxd4UlhpGoBZI6TnZzpvl4ULRai6qeHrFecYPZsLL1D800xd4LsvUpnqA5tsFeixzNi-01gVKk-njCps/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/AVvXsEinpWt4Ivk2znZ0SGlHKRkZJioLUewK9oSPz0bFjp93I2AggiM1A6SNDhG_mOhq66Lv5SptXOP6qlamurCE4rlsJQpBz-lzeDBm3LB8yQflFXtjPjJSfBB2V8zExKNCpKHU31kU75sPoIM/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/AVvXsEg4wNxoJBC3GiF_q9N1swCDKSPRwwVzawhXVsvw1xB8dVKT0Z3qjuew1ec6eQryrlRoqzNGN4_NbjrU3aw_Yw2bhrFmMOtM7Nz4jhU__8Mub0gfTTazW3n94svCKjMvFWamO9DW0QYqMok/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/AVvXsEiNTmhfNOZqG0QkwSJN1vnEzTE-0RiJv-_XrREJfIe9wTh0HUwE4BZNxpJo8tzE1eqV6WqjM1xgIpNrkMTRJcTNbf5oqa3VnAsT-MoozPLO76pLx_2941hg9xpZoObsh6hE7X11a0Ta-qY/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/AVvXsEi9iX8TedzyPCS20Ci3nizS6NJ2KxBfIypzln3otQ-3NE8sqIvzxOBEs51PES9YRffAK3xN0YE18h_nPFrD4F0079o-Uc7ycJNkoKM-zSheY-4Qc4oJJ9u5A59wbKlSuLNpSwBgGwUPbOVs/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
Dan untuk menyimpan Code - Code diatas ini masuk ke artikel ini:
Selesai Gimana blockquotenya keren - keren gak,,hhe lumayan panjang ni .
Postingan 20 Blockquote Keren Untuk Blogspot Sudah Selesai. Semoga Bermanfaat. Salam Mukti
Selesai Gimana blockquotenya keren - keren gak,,hhe lumayan panjang ni .
Postingan 20 Blockquote Keren Untuk Blogspot Sudah Selesai. Semoga Bermanfaat. Salam Mukti






















