Главная » Wordpress » Оформление цитат (blockquote) в WordPress при помощью CSS

Оформление цитат (blockquote) в WordPress при помощью CSS

Часто возникает необходимость выделить в блоге определенную часть текста. Для этих целей часто используются цитаты – <blockquote>. В данном посте я покажу вам несколько вариантов их оформления.

Вариант 1

цитата Wordpress CSS blockquote  wordpress

Код для добавления  в style.css вашей темы:

blockquote {
    margin: 1em 3em;
    color: #999;
    border-left: 2px solid #999;
    padding-left: 1em; }

Вариант 2

цитата Wordpress CSS blockquote  wordpress

Код для добавления в style.css вашей темы:

blockquote {
    margin: 1em 3em;
    padding: .5em;
    background-color: #f6ebc1; }
blockquote p {
    margin: 0; }

Вариант 3

цитата Wordpress CSS blockquote  wordpress

Код для добавления в style.css вашей темы:

blockquote {
    margin: 1em 3em;
    padding: .5em 1em;
    border-left: 5px solid #fce27c;
    background-color: #f6ebc1; }
blockquote p {
    margin: 0; }

Вариант 4

цитата Wordpress CSS blockquote  wordpress

Код для добавления в style.css вашей темы:

blockquote {
    margin: 1em 2em;
    border-left: 1px dashed #999;
    padding-left: 1em; }
blockquote p:first-letter {
    float: left;
    margin: .2em .3em .1em 0;
    font-family: "Monotype Corsiva", "Apple Chancery", fantasy;
    font-size: 220%;
    font-weight: bold; }
blockquote p:first-line {
    font-variant: small-caps; }

Вариант 5

цитата Wordpress CSS blockquote  wordpress

Код для добавления в style.css вашей темы:

blockquote {
    color: #66a;
    font-weight: bold;
    font-style: italic;
    margin: 1em 3em; }
blockquote p:before {
    content: '"'; }
blockquote p:after {
    content: '"'; }

Похожие записи
Удаление в Worepress #more из ссылки Читать далее ... На самом деле навсегда удалить #more из ссылок в постах, ведущих с Read More достаточно просто.В файд function.php своей темы добавьте следующий код: ...
Публикация постов в WordPress через Windows Live W... Подозреваю, что большинство пользователей привыкли публиковать записи в своих блогах используя веб-интерфейс Wordpress. Хочу предложить вашему внимани...
Изменение URL результатов поиска в WordPress... На блоге Дмитрия Донченко подсмотрел интересную функцию для замены URL результатов поиска по блогу на WordPress. Для наглядности приведу примеры URL ...
Ограничение доступа к страничке авторизации WordPr... Сегодня просмотрел статистику плагина Limit Login Attempts (Ограничение попыток авторизации в WordPress) и ужаснулся. За 2 недели заблокировано 16 58...
This entry was posted in Wordpress and tagged , , , . Bookmark the permalink.

1 комментарий: Оформление цитат (blockquote) в WordPress при помощью CSS

  1. Агент 00x говорит:

    Спасибо за подробный мануал! Но я не люблю готовые варианты, всегда делаю что-нибудь свое. Разобрался-то сразу, чего там найти нужный кусок css, так из-за кэша ничего не выходило, вот полез гуглить. Надеюсь мой коммент кому-нибудь поможет)

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *