Оформлення цитати тег blockquote

Тег blockquote призначений для виділення частини тексту зі стилями, що відрізняють від основного тексту. Зокрема, це виділення цитати і оформляється як прийнято в лапках ( «....»). Але це Нечитка правило можна трохи пофантазувати і стилізувати тег blockquote на свій смак. У WordPress цитата вставляється в панелі оформлення тексту в скороченому вигляді «b-quote». Досить виділити уривок тексту і натиснути на «b-quote» після чого фрагмент тексту буде обгорнутий в тег blockquote.

Це дуже зручно і зовні підкреслює дизайн що вельми приємно для очей. У тега blockquote є атрибут cite за допомогою якого, вказується джерело цитати.

Але також cite використовується, як тег і визначає ім'я творів (пісня, фільми, книги і т.д.)

Що стосується підтримки, то тег blockquote підтримують всі популярні браузери.

Давайте розглянемо декілька цікавих прикладів оформлення цитати.

Оформлення цитати без лапок.

Мінімалізм завжди вітається, простенько і зі смаком. Пару ліній, фон відповідного кольору і оформлення цитати готове. Такі стилі можна зустріти на багатьох сайтах, адже головне, виділити цитату від основного контенту. Щоб користувач відразу звернув увагу на цю частину тексту.

Оформлення цитати з картинками

Для різноманітності або якщо дизайн сайту вимагає можна оформити цитату з картинками. Додати різні елементи, скріпку, книжковий орнамент або чийсь портрет і т.д. Це наскільки фантазія дозволяє робити щось креативне.

Оформлення цитати з лапками.

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

Сподіваюся для вас матеріал був корисний, і ви вибрали що-небудь для себе цікаве.

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

CSS ефекти для кнопок

Як зробити кілька фонових зображень CSS

Кнопки CSS. Короткий мануал з прикладами