Оформление цитат в блоге

---

Как красиво оформить цитаты в блоге

Привет, сегодня короткий пост об оригинальном оформлении цитат в сообщении блога. В одном из своих постов я писала, как выделить текст цитатой. Ставите курсор в начало абзаца или выделяете текст левой кнопкой мыши, и нажимайте в редакторе сообщений значок-цитата.

В этом оформлении текст будет красиво выделяться на фоне сообщения. Пример можете посмотреть на коде ниже. Этот же код скопируйте и вставьте черновик blogger-дизайн-добавить гаджет-Html/JavaScript-вставить-сохранить где-нибудь в нижней части страницы.

Color: #F2F1F1-цвет фона, #ff9900-цвет при наведении мыши, #eeeeee;-цвет при прокрутке.  С другими настройками экспериментируйте (у меня в коде выделено), dotted-это форма рамки.

<style>.post blockquote
{
font-size: 15px;font-family: Verdana;font-weight: normal;font-style:italic;
background-color: #F2F1F1;
color: #000;
margin: 5px 10px;
padding: 20px 20px 20px 20px;
border: 2px dotted lightgrey;
border-radius: 10px;
box-shadow: -1px -1px 12px 2px gainsboro;
transition: background-color .777s;
-webkit-transition: background-color .777s;
-moz-transition: background-color .777s;
-o-transition: background-color .777s;
-ms-transition: background-color .777s;
}
.post blockquote:hover
{
background-color: #ff9900;CornflowerBlue ;
color: #fff;
}
.post blockquote:active
{
background-color: #eeeeee; lightblue ; ;
color: #000;
}

</style>

Почитайте  красивые стили для оформления цитат в блоге Blogspot

Рекомендуемый контент: