Бесплатный форум: форум поддержки
Добро пожаловать на форум поддержки сервиса Forum2x2 !

Для полноценной работы с форумом,
пожалуйста, войдите на форум под своим логином (если вы уже зарегистрированы) или же зарегистрируйтесь.


С нашей помощью вы можете создать форум,
похожий на этот!
Мы в социальных сетях

Правила форума

для обязательного прочтения!


Внимание! Важная информация для РЕГИСТРАЦИИ на форуме:

Пожалуйста, не регистрируйтесь на этом форуме с электронными адресами mail.ru, bk.ru, inbox.ru, list.ru - вам может не прийти письмо со ссылкой активации!
Вы можете воспользоваться адресами типа yandex.ru, rambler.ru, gmail.com и т.д.
Интересные решения
Быстрый переход к сервисам: j-p-g.net Видео фоторедактор Транслит

Красивое оформление блока цитаты [punBB] [phpBB3] [IPB]

Предыдущая тема Следующая тема Перейти вниз

Красивое оформление блока цитаты [punBB] [phpBB3] [IPB]

Сообщение автор Домовой в Вс 15 Дек - 16:17

Оригинальное оформление блока цитаты через CSS



Для punBB



Код:
/* Quote on punBB*/
.postmain blockquote{
background:none;
border:0!important;
position:relative;
overflow:hidden;
min-height:35px!important;
margin:10px 0;
padding:11px 0 6px 10px;
font-size:14px; /*размер шрифта*/
line-height:18px;
color:#504536; /*цвет текста*/
font-family:Georgia; /*шрифт*/
font-style:italic; /*наклонный текст*/
}
.postmain blockquote div {
margin-top:7px;
margin-left:6px;
-moz-border-radius:8px;
-khtml-border-radius:8px;
-webkit-border-radius:8px;
border-radius:8px;
border:solid 1px #D5DEE5; /*рамка блока цитаты*/
background:url(http://i58.servimg.com/u/f58/14/80/95/87/spback10.png) bottom left repeat-x #FFF; /*фон цитаты*/
max-width:91%; /*максимальная ширина*/
padding:15px 20px 10px 23px;
position:relative;
}
.postmain blockquote div:before {
content:'';
background:url(http://i58.servimg.com/u/f58/14/80/95/87/openq10.png) top left no-repeat transparent; /*открывающая кавычка*/
position:absolute;
width:16px;
height:16px;
top:15px;
left:3px;
}
.postmain blockquote div:after {
content:'';
position:absolute;
z-index:100;
background:url(http://i58.servimg.com/u/f58/14/80/95/87/closeq10.png) top left no-repeat transparent; /*закрывающая кавычка*/
width:16px;
height:16px;
right:4px;
bottom:4px;
}
/*шапка заголовка цитаты*/
.postmain blockquote div cite {
font-style:normal;
font-weight:700; /*жирный текст*/
display:block;
font-size:13px;  /*размер текста заголовка*/
color:#fff;
background:url(http://i58.servimg.com/u/f58/14/80/95/87/qhm10.png) top left repeat-x transparent; /*фон заголовка (средняя часть)*/
height:32px;
position:absolute;
z-index:100;
top:-15px;
text-shadow:#000 1px 1px; /*тень шрифта заголовка*/
left:0px;
}
.postmain blockquote div cite:before {
content:'';
position:absolute;
z-index:-1;
background:url(http://i58.servimg.com/u/f58/14/80/95/87/qho10.png) no-repeat 0 0 transparent; /*фон заголовка (левая часть - сапог)*/
width:31px;
height:38px!important;
left:-13px;
top:0;
}
.postmain blockquote div cite:after {
content:'';
background:url(http://i58.servimg.com/u/f58/14/80/95/87/qhc10.png) no-repeat 0 0 transparent; /*фон заголовка (правая часть)*/
position:absolute;
right:-10px;
width:10px;
height:32px;
top:0;
}



Для phpBB3



Код:
/* Quote on BB3 */
blockquote blockquote,blockquote blockquote
blockquote {
background:none;
border:0!important;
}
blockquote{
background:none;
border:0!important;
position:relative;
overflow:hidden;
min-height:35px!important;
margin:10px 0;
padding:14px 0 10px 8px;
font-size:14px; /* размер шрифта */
line-height:18px;
color:#504536; /* цвет шрифта */
font-family:Georgia; /* название шрифта */
font-style:italic; /* наклонный шрифт */
}
blockquote div {
margin-top:7px;
margin-left:6px;
-moz-border-radius:8px;
-khtml-border-radius:8px;
-webkit-border-radius:8px;
border-radius:8px;
border:solid 1px #B38000; /* рамка цитаты */
background:url(http://i58.servimg.com/u/f58/14/80/95/87/7699510.jpg) bottom left repeat-x #FFFEF9; /* фон блока цитаты */
max-width:92%; /* максимальная ширина цитаты */
padding:10px 20px 10px 20px;
position:relative;
}
blockquote div:before {
content:'';
background:url(http://i58.servimg.com/u/f58/14/80/95/87/openq12.png) top left no-repeat transparent; /* открывающая кавычка */
position:absolute;
width:11px;
height:11px;
top:15px;
left:3px;
}
blockquote div:after {
content:'';
position:absolute;
z-index:100;
background:url(http://i58.servimg.com/u/f58/14/80/95/87/closeq12.png) top left no-repeat transparent; /* закрывающая кавычка */
width:11px;
height:11px;
right:4px;
bottom:2px;
}
blockquote div cite {
font-style:normal;
font-weight:700;
display:block;
font-size:13px; /* размер шрифта заголовка цитаты */
color:#000; /* цвет шрифта заголовка цитаты */
background:url(http://i58.servimg.com/u/f58/14/80/95/87/qhm11.png) top left repeat-x transparent; /* фон шапки цитаты (средняя часть) */
height:32px;
line-height:24px;
position:absolute;
z-index:100;
top: -18px;
text-shadow:#fff 1px 1px; /* тень текста заголовка */
left:0px;
}
blockquote div cite:before {
content:'';
position:absolute;
z-index:-1;
background:url(http://i58.servimg.com/u/f58/14/80/95/87/qho11.png) no-repeat 0 0 transparent; /* фон шапки цитаты (левая часть - сапог) */
width:31px;
height:38px!important;
left:-13px;
top:0;
}
blockquote div cite:after {
content:'';
background:url(http://i58.servimg.com/u/f58/14/80/95/87/qhc11.png) no-repeat 0 0 transparent; /* фон шапки цитаты (правыя часть) */
position:absolute;
right:-10px;
width:10px;
height:32px;
}



Для IPB



Код:
/* Quote on IPB */
blockquote{
background:none;
border:0!important;
min-height:35px!important;
padding:14px 30px 5px 8px;
font-size:14px; /* размер шрифта */
line-height:17px;
color:#504536; /* цвет шрифта */
font-family:Georgia; /* название шрифта */
font-style:italic; /* наклонный шрифт */
}
blockquote div {
border-radius:8px;
border:solid 1px #B38000; /* рамка цитаты */
background:url(http://i58.servimg.com/u/f58/14/80/95/87/7699510.jpg) bottom left repeat-x #FFFEF9; /* фон блока цитаты */
max-width:92%; /* максимальная ширина цитаты */
padding:10px 20px 10px 20px;
position:relative;
}
blockquote div:before {
content:'';
background:url(http://i58.servimg.com/u/f58/14/80/95/87/openq12.png) top left no-repeat transparent; /* открывающая кавычка */
position:absolute;
width:11px;
height:11px;
top:15px;
left:3px;
}
blockquote div:after {
content:'';
position:absolute;
z-index:100;
background:url(http://i58.servimg.com/u/f58/14/80/95/87/closeq12.png) top left no-repeat transparent; /* закрывающая кавычка */
width:11px;
height:11px;
right:4px;
bottom:2px;
}
/* оформление заголовка */
blockquote div cite {
font-style:normal;
font-weight:700; /* жирный шрифт */
display:block;
font-size:13px; /* размер шрифта заголовка цитаты */
color:#000; /* цвет шрифта заголовка цитаты */
background:url(http://i58.servimg.com/u/f58/14/80/95/87/qhm_210.png) top left repeat-x transparent; /* фон шапки цитаты (средняя часть) */
height:32px;
position:absolute;
z-index:100;
top:-10px;
text-shadow:#fff 1px 1px; /* тень текста заголовка */
left:27px;
}
blockquote div cite:before {
content:'';
position:absolute;
z-index:-1;
background:url(http://i58.servimg.com/u/f58/14/80/95/87/qho_210.png) no-repeat 0 0 transparent; /* фон шапки цитаты (левая часть - сапог) */
width:31px;
height:38px!important;
left:-31px;
top:0px;
}
blockquote div cite:after {
content:'';
background:url(http://i58.servimg.com/u/f58/14/80/95/87/qhc_210.png) no-repeat 0 0 transparent; /* фон шапки цитаты (правыя часть) */
position:absolute;
right:-10px;
top:0px;
width:10px;
height:32px;
}

P.S. Цвета, шрифт и фоны естественно можно заменять на свои.
avatar
Домовой
 

Мужчина

Сообщения : 6805
Возраст : 93
Регистрация : 2010-01-30
Благодарности : 3230

Без предупреждений

Вернуться к началу Перейти вниз

Предыдущая тема Следующая тема Вернуться к началу


 
Права доступа к этому форуму:
Вы не можете отвечать на сообщения