Красивое оформление цитат для blogger blogspot.

Погода начинает нас потихоньку радовать. Поэтому на выходных почти не было времени уделить время блогу. Сегодня я к вам пришла  с интересным оформлением цитат.

Иногда блоггеры пишут цитаты или хочется выделить  какую-то часть текста, чтобы она бросалась в глаза. Для этого можно использовать функцию цитат в панели, при написании поста.

 Но дело в том, что  такие цитаты все равно не очень уж и выделяются.

 Поэтому  предлагаю несколько вариантов оформления цитат для blogspot.

Чтобы получилась вот такая цитата:

Найдите  тег

]]></b:skin>

И чуть выше вставить код

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

 Для  такого вида цитаты

Вставте этот код 

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

 Чтобы цитата выглядила так 

 Вставте этот код

.post blockquote {
margin : 0 80px;
padding: 70px 20px 30px 20px;
background : #E7E5DC url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8biD8zuKiVXdp2_32lbyG0RFiuY6g3PWrhPWNX38y6JvVNRhTFdjNQtdigbBQ1CSE_st6zz7RSqN5Il0unYL2LGdHmyq03_tR7JsWRdZ8WGd9eCfaOGUVbFapzOMqWOSXvDsZUaiD6u19/s400/bloc.jpg) 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;
}

 Для голубого фона цитат

Этот код

.post blockquote {  margin : 0 20px;  padding: 10px 20px 25px 20px;  background : #9FCFFF url() 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;  }

 И  последний 

Этот код

 .post  blockquote { margin : 0 20px;  padding: 60px 30px 40px 20px;  background : #F1F8FE url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg7Rap1n8-0gOo_l6F-QPE6TcP2aJIHt-IugjoJ-2Cd9h5LNAQC-bhDz155xalm_wTveeZkPIaRR4p9Hxwtqq9JD1gi_m6u2cOZGz9aitF6IGXJECbs2rB3bMdedaxJDyMj7BhQrCUDiow/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;  }

 Надеюсь, статья оказалась для вас полезной. Не бойтесь экспериментировать в шаблоне, благодаря вот таким уникальностям, ваш блог, становиться в разы лучше.

выделяете текст, нажимаете на кавычки.

Пожалуйста не забывайте нажать