Дизайн принадлежит администрации сайта VSEpodrad.ru.
Администрация не несет ответственности за содержимое на нашем портале.
Администратор: .
|
Меню сайта
Смотри и качай бесплатно
Опрос сайта
Реклама
Онлайн пользователи
Онлайн всего: 1
Гостей: 1
Пользователей: 0
Раздел в разработке
VSEpodrad.ru
В разработке!
На сайт добавлено файлов
Цитата с Multi-Line отступом для ucoz
Цитата с Multi-Line отступом для ucoz. Пример ячейки цитаты, в которой прописываем отступы и текст вашей цитаты, обтекает изображение кавычек.
Текст обтекает изображение кавычек, плюс кавычки имеют отступы, по отношению текста и основной ячейки цитаты, смотрим в исходный код:
Code
<blockquote>
<span></span>
Текст цитаты
</blockquote>
<span></span>
Текст цитаты
</blockquote>
В CSS-Code
Code
blockquote {text-align:justify;
background: #fff url('bg_blockquote.png') no-repeat 17px 18px;
padding: 10px 10px 10px 10px;
width: 330px;
border: solid 1px #dcdcdc;
font: 115%/1.5 Verdana,Arial,Helvetica, sans-serif;
}
blockquote span {
display: block;
float: left;
width: 58px;
height: 40px;
}
background: #fff url('bg_blockquote.png') no-repeat 17px 18px;
padding: 10px 10px 10px 10px;
width: 330px;
border: solid 1px #dcdcdc;
font: 115%/1.5 Verdana,Arial,Helvetica, sans-serif;
}
blockquote span {
display: block;
float: left;
width: 58px;
height: 40px;
}
как мы видим из кода, мы создали ячейку blockquote, в которую поместили текст цитаты и тег span, которому прописали ширину и высоту чуть больше основного изображения цитаты, тем самым текст цитаты обтекает тег span и наше изображение кавычек.
Второй вариант ячейки цитаты:
Текст цитаты не обтекает изображение кавычек, а идёт сплошным текстом, а под изображением, остаётся пустое пространство, давайте посмотрим в исходный код.
Code
<div id="citation">
текст цитаты
</div>
текст цитаты
</div>
В CSS-Code
Code
#citation {
text-align:justify;
background: #fff url('bg_blockquote.png') no-repeat 17px 18px;
padding: 10px 10px 10px 70px;
width: 270px;
border: solid 1px #dcdcdc;
font: 115%/1.5 Verdana,Arial,Helvetica, sans-serif;
}
text-align:justify;
background: #fff url('bg_blockquote.png') no-repeat 17px 18px;
padding: 10px 10px 10px 70px;
width: 270px;
border: solid 1px #dcdcdc;
font: 115%/1.5 Verdana,Arial,Helvetica, sans-serif;
}
как мы видим из кода, мы прописали основной ячейки цитаты, внутренний левый отступ в 70px и добавили изображение, в верхний левый угол.
Вы можете скачать исходники вместе с png изображением кавычек, в изначальном варианте, они имели розовый фон, поэтому о смене основного фона ячейки цитаты не могло идти и речи.
Вы сейчас просматриваете Цитата с Multi-Line отступом для ucoz. Данный файл находится в категории Скрипты для ucoz. Чтобы увидеть другие файлы из этой категории, перейдите по этой ссылке: Скрипты для ucoz. Для того чтобы скачать Цитата с Multi-Line отступом для ucoz нажмите на кнопку СКАЧАТЬ ФАЙЛ выше. Надеемся вам понравился файл Цитата с Multi-Line отступом для ucoz и пригодился. По всем вопросам обращайтесь в чат на сайте или к администрации.
| Всего комментариев: 0 | |
