Видео-уроки
Статистика
Комментарии

в 19:43 19.02.2024

в 00:58 25.12.2023
как зробить шоб зразу с текстурой появилос

в 13:17 20.07.2023
Содержимое сайта
Последние обновленные темы на форуме
Последний: 23a3sdasdasd322
Социальные сети
Тему создал Vetal, В Разделе: Социальные сети
6
Ответов
Последний: eniston4739
Дизайн сайта
Тему создал Raccoon, В Разделе: Общение
9
Ответов
Последний: eniston4739
Общение Mir-Devil
Тему создал Vetal, В Разделе: Общение
36
Ответов

  • Страница 1 из 1
  • 1
Стиль оформления цитаты с картинкой
Дата: Воскресенье, 11.06.2017, 15:02 | Сообщение # 1
Infe[R]nos
Пользователи
79Сообщения:
ICQ пользователя:
Skype пользователя:
Сайт пользователя:
Давайте рассмотрим одну красивую и интересно сделанную по оформлению цитату. Которая полностью создана на CSS и устанавливается на сайт. Ее можно быстро встроить в любое описание на материал, также органично смотрится на сайте, так как в себе несет красивую стилистику.

А это безусловно само изображение, которое вы можете сменить и поставить свое. И потом под него уже вывести оттенок цвета шрифта, и все это делается в этом стиле и не нужно что то выставлять на основном. Теперь у вас есть возможность создавать красивые и уникальные статьи, где цитата будет великолепно смотреться.

Как всегда рассмотрим, как реально будет.



Код
[color=green]Приступаем к установке:[/color]

Первым делом идем в админ панель в CSS:

blockquote {  
  background-image:url(http://zornet.ru/zorner_ru_1/Veb/87d1a569e41e4471b4bf4611725a360e.jpg);  
  font-size: 14px;  
  color: #fff;  
  border: 2px dotted #26dbfe;  
  padding: 35px;  
  margin:1em 20px;  
  border-radius: 10px;  
  -o-border-radius: 10px;  
  -moz-border-radius: 10px;  
  -webkit-border-radius: 10px;  
}
  


Чтоб поставить, то вам нужно описание разместить в blockquote, как пример, смотрим ниже.

Код
<blockquote> Здесь ваше описание на фоне, что будет </blockquote>

Дата: Вторник, 20.06.2017, 10:42 | Сообщение # 2
Harvus
Пользователи
22Сообщения:
ICQ пользователя:
Skype пользователя:
Сайт пользователя:
Интересная задумка..
  • Страница 1 из 1
  • 1
Поиск: