Google+ Followers

Будь в курсе событий!

15.04.2013

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

Leave a Comment

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

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

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

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

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



Найдите  тег
]]>

И чуть выше вставить код
 .post blockquote {
background: #F3F3F1 url(http://3.bp.blogspot.com/_7wsQzULWIwo/Swb5Jv9YD4I/AAAAAAAACPc/BJ-zgoLMJXw/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(http://3.bp.blogspot.com/_7wsQzULWIwo/Swb5J3xbxyI/AAAAAAAACPk/gxR76OhXXaw/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://lh4.googleusercontent.com/-FqFqU61QjKA/UWuXx8otubI/AAAAAAAACLw/iP4gimAMCw8/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(http://3.bp.blogspot.com/_7wsQzULWIwo/SwhrZYtvrRI/AAAAAAAACRs/Q0k6eaIjnys/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; }
 Надеюсь, статья оказалась для вас полезной. Не бойтесь экспериментировать в шаблоне, благодаря вот таким уникальностям, ваш блог, становиться в разы лучше.
выделяете текст, нажимаете на кавычки.



Система Orphus

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

0 коммент. :

© 2012-2017 Cash's from program