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

15.04.2013

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

Leave a Comment

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

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

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

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

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



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

И чуть выше вставить код
 .post blockquote {
background: #F3F3F1 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj04-mGnmgJheiJBLZjabCIToXBsZDqBuEOAkiKvjDVfqEux2AuXx5XC7awN_49c5s9kP9doq-JP-BDLLC-OdVGMfdBgiv4VMzdXooNOQbro7x3Pn78PYBlwyy0_QKXSMAyL7ibvG4J0G0/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/AVvXsEj27WjPmkXigKK7z-1hiSgNrog4xSpC_EwHQtMkRXM4bS-9VJ6M37cE4RpZQ0CbeNAJmL9Z6a5UdsGMMyuhldk-17x2jVwiMShFgzOGiGx7kZR27lYoaLnbNz4QDN6IVghksHTA9J1YwJ4/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/AVvXsEgkt-xbeqeN37UkC5jcnLdk2tfpnC6LB9_hTqweJTG1lfJTtPJZM8GhNUMBy0MVYtfJTxOaBHs4h4T3mVhb0wrukIb66IhNYuGEesGGo7xkEajQ-azBElkZoHucq5LICsuyPqi8xEX4TzSN/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/AVvXsEi6bWLX9RcsB4shfXCXfZD21e8gKLlVHp1fxrS5DZn2wmbmhuwornp-4U37wr1G5qVZiaacqn8kx87KWTTIEYtg5kmFTvUK1t9Zi7ncncLSeexCiCESPHAW4zqBIEGkzw8EKtPimMXsMds/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