Красивое оформление цитат на странице при помощи CSS

Всем привет и добро пожаловать на SerBlog.ru. Не так часто, но иногда приходится пользоваться тегами (blockquote) цитат на странице. Обычно это происходит в комментариях, когда нужно процитировать ранее опубликованный комментарий, чтобы было понятно кому вы ответили. Или же просто выделить в статье какую-то часть текста, чтобы сделать акцент и привлечь внимание читателя к чему-то очень важному, по вашему мнению. Обычно в таблицах стилей сайтов уже прописано какое-то оформление для этого тега, но в большинстве случаев это оформление ограничивается лишь наклоном текста. Поэтому мы попробуем изменить эту ситуацию и настроить оформление так, как нам нужно. Выглядеть эту будет вот так:

Знать много и не выставлять себя знающим есть нравственная красота. Знать мало и выставлять себя знающим есть болезнь. Только понимая эту болезнь, мы можем избавиться от нее.
Лао Цзы.

Для того, чтобы изменить оформление, нужно открыть таблицу стилей, обычно это style.css и найти там blockquote. Добавить или вставить вместо тех, которые есть примерно такие строчки:

1
2
3
4
5
6

	font-size:14px;
	color:#444ddf;
	background-color:#ffc;
	border-style:dashed;
	border-width:2px;
	border-color:red;

Первые 2 строчки это размер и цвет текста. Третья — это фон. Четвертая-рамка (dashed-пунктирная линия). Дальше-размер этой рамки и ее цвет.

Популярность: 17% [?]

Читайте также

• 14.10.2011 -- Вертикальное меню для сайта
• 09.10.2011 -- Choco — Современный CSS шаблон для сайта
• 07.10.2011 -- Template Db — Бесплатный CSS шаблон для сайта
• 01.08.2011 -- CSS кнопки для любого сайта
• 17.07.2011 -- Красивая кнопка для сайта. Используем CSS-3