mir-m.ru - Правильное оформление цитат. Как оформлять цитаты в тексте

Закрыть ... [X]

Как выделить цитату в интернете

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

Стилизация цитат с помощью CSS

blockquote { background: #f7f7f7; border-left: 1px solid #bbb; font-style: italic; margin: 1.5em 10px; padding: 0.5em 10px; } blockquote:before { color: #bbb; content: "1C"; / Непечатаемый символ слева / font-size: 3em; line-height: 0.1em; margin-right: 0.2em; vertical-align: -.4em; } blockquote:after { color: #bbb; content: "1D"; / Непечатаемый символ справа / font-size: 3em; line-height: 0.1em; vertical-align: -.45em; } blockquote > p:first-child { display: inline; }

Для декорации использую т.н. немецкие кавычки вида "лапки". Шрифты: Georgia, "Times New Roman", Times, serif. Междустрочный интервал: 1.5.

Как видите ничего сверх-сложного, никакой графики, - только код стилей. А теперь все это в действии.

© 2012-2014 Druweb.ru. Вы можете спокойно копировать любые материалы сайта только при наличии обратной ссылки.


Источник: http://druweb.ru/nice-blockquote.html


Поделись с друзьями



Рекомендуем посмотреть ещё:



CSS - эффектная стилизация цитат с кавычками в HTML - Блог о Оригами из модулей-вазы-видео

Как выделить цитату в интернете Красивое оформление цитат на сайте с помощью CSS
Как выделить цитату в интернете Как оформлять цитаты? - «Грамота. ру» справочно
Как выделить цитату в интернете Как оформить цитаты в тексте - wikiHow
Как выделить цитату в интернете Википедия:Цитирование Википедия
Как выделить цитату в интернете Disqus - Статус серверов GTA Online
Как выделить цитату в интернете Блокнот Уничтожь меня! Кери Смит - Самый популярный в
Здесь найдется все! Как покрасить ткань растворимым кофе для тельца Тильды БЛОГ ДОМОХОЗЯЙКИ Как снять клей с ногтей : - территория женских разговоров Окрашивание ткани для куклы Тильда чаем Кукольных дел мастер

ШОКИРУЮЩИЕ НОВОСТИ