2015-05-23

blogger.com ч.1: меняем оформление цитат

Блог в котором я живу
называется "стили говно, 2 года править"
В общем есть пара триксов, на тему "как заставить блоггер ком выглядить не так стремно", и для начала мне захотелось исправить выделение цитат. На просторах инета я нашел отличный рецепт, результат работы которого можно видеть выше.

Переходим в настройки блога, выбираем "шаблон" и тыкаем кнопку "настроить":



Дальше "Дополнительно" и "добавить CSS":



Добавляем в окно вот этот текст:

.tr_bq {
  border-left: 4px solid #2288bb;
  margin: 1.5em 10px;
  padding: 0.5em 10px;
  quotes: "\201C""\201D""\2018""\2019";
}
.tr_bq:before {
  color: #2288bb;
  content: open-quote;
  font-size: 4em;
  line-height: 0.1em;
  margin-right: 0.25em;
  vertical-align: -0.4em;
}

.tr_bq:after {
  color: #2288bb;
  content: close-quote;
  font-size: 4em;
  line-height: 0.1em;
  margin-left: 0.25em;
  vertical-align: -0.4em;
}


Можно поиграться с цветом:
- строчка "border-left: 4px solid #2288bb;" - это левая полоска, ее толщина, стиль и цвет
- строчки "color: #2288bb;" в последующих двух разделах - это цвета открывающих и закрывающих кавычек, их лучше менять вместе =)

Комментариев нет:

Отправить комментарий