Красивое отображение цитат в тексте
827материалов
228тем на форуме
3003комментария
6152пользователя

Красивое отображение цитат в тексте


Всем доброго дня, я парой очень часто слышу о том, что многие читатели моего сайта хотят знать, как установить ячейку цитаты в тексте контента таким образом, чтобы текст обтекал данную ячейку.

Поэтому как и полагается смотрим демо и читаем инструкцию по установки.

Шаг 1 - Установим HTML:
Всё что вам необходимо, так это установить в текст контента ячейку div с текстом вашей цитаты:

HTML
Код
<div class="cell-quote-1">текст цитаты</div>


Шаг 2 - Установим CSS:
А теперь устанавливаем наши css стили:

CSS-Code
Код
.cell-quote-1{  
   float:right;  
   width:250px;   
   padding: 10px 15px 10px 15px;   
   background: #F4F8F9;  
   margin: 5px 0px 5px 30px;   
   border-left: 2px solid #B6C0CD;  
   font-style: oblique!important;   
}  

.cell-quote-2{  
   float:left;  
   width:250px;   
   padding: 10px 15px 10px 15px;   
   background: #F4F8F9;  
   margin: 5px 30px 5px 0px;   
   border-right: 2px solid #B6C0CD;  
   font-style: oblique!important;   
}

Как вы видите в данном css коде, основную роль играет тег float:left; и float:right; в зависимости от первого или второго примера ячейки цитаты.

На этом всё, спасибо за внимание!

ПОСМОТРЕТЬ ДЕМО ЗАКАЗАТЬ УСТАНОВКУ

Скрипт опубликовал:
...
Логин на сайте: ...
Группа: ...
Статус: ...
Информация о скрипте:
Дата добавления материала: 13.08.2013 в 13:08
Материал просмотрен: 649 раз
Категория материала: Скрипты для uCoz
К материалу оставлено: 0 комментариев

Пожаловаться
Сказать спасибо

0 комментариев


avatar
Вход через социальные сети
Работа в компании uCoz
uSocial - социальные кнопки
uLike – кнопка «Мне нравится»
Статистики нашего сайта