Вопросы/проблемы со стилем vol.02>>

Book Antiqua - семейство шрифа. Найти их можно под буковкой . Использовать иные семейства - крайне нежелательно.
Если же под расположением имелось в виду сделать справа/слева/по центру, то меняете center на, соответственно, right/left.

0

Поделиться45721-05-2010 19:36:23

Автор: .|gold opium
героиновый шик
Уважение: +10
Зарегистрирован: 16-04-2010
Провел на форуме:
1 день 9 часов
Последний визит:
03-10-2011 14:18:02

а как сделать так. чтобы вообще видишь одну картинку, а когда не неё мышку наводишь, там другая появляется?

0

Поделиться45821-05-2010 19:42:35

Автор: Wilhelm
Angelus Domini
Уважение: +484
Зарегистрирован: 30-09-2009
Провел на форуме:
25 дней 4 часа
Возраст: 36 [1988-01-24]
Пол: Мужской
Последний визит:
30-09-2012 13:55:02

.|gold opium
Это можно прописать через CSS, используя псевдоэлемент hover.
Вот я некогда на этом ресурсе показывал урок, его можно применить к изображениям в таблице, html-верхе-низе:

Wilhelm написал(а):

Руководство к действию.
Эффект переката
Рассмотрим сейчас именно такой перекат - когда для каждой ссылки заводится своя индивидуальная картинка.

Итак, как я уже говорил ранее, перекат этот я организовал с помощью псевдокласса hover (Определяет стиль элемента при наведении на него курсора мыши, при этом элемент не активирован, иными словами кнопка мыши не нажата).
Итак, создаем в фотошопе или ином редакторе двойную картинку: сверху будет то, как должен выглядеть элемент в неактивном положении, ниже - так, как он должен выглядеть при наведении на него мыши. Я создал такую картинку:

Не удаляйте psd-файл, возможно, он вам еще потребуется.
Организовываем селектор. Это можно сделать, прописав определенный код в CSS (поместить в первое окошко стиля в конец общего кода или же заключить в тэги <style> и поставить в html-верх):
/*Сюжет*/
a#storyb {
width: 150px; /*ширина картинки*/
height: 50px; /*длина картинки. Не полностью, лишь половина*/
display: inline-block;
background: transparent url("картинка_сюжет") no-repeat scroll 0 0;
}

a#storyb:hover {
background: transparent url("картинка_сюжет") no-repeat scroll 0 100%;
outline: none !important;
}
Теперь в объявлении можно поместить ссылку на этот самый сюжет:
<a href="ссылка_сюжет" id="storyb" alt="Сюжет"></a>
Таким же образом прописываем и другие элементы, но не забудьте потом менять имя селектора в тэге <a>
/*Правила*/
a#rulesb {
width: 150px;
height: 50px;
display: inline-block;
background: transparent url("картинка_правила") no-repeat scroll 0 0;
}

a#rulesb:hover {
background: transparent url("картинка_правила") no-repeat scroll 0 100%;
outline: none !important;
}
<a href="ссылка_правила" id="rulesb" alt="Правила"></a>
Enjoy )

А можно и скриптом )
Вот что по этому поводу есть на борде (не правил, с картинками разбираться самим):
<br><br> <center><a href="http://prophecy.forum24.ru/?32-helgdheartbreak" onMouseOver="imgOn('img1')"; onMouseOut="imgOff('img1')"><img src="http://i218.photobucket.com/albums/cc20/emotional_prince/helg2.png" width="57" height="110" border="0" name=img1></a><a href="http://prophecy.forum24.ru/?32-jamietate" onMouseOver="imgOn('img2')"; onMouseOut="imgOff('img2')"><img src="http://i218.photobucket.com/albums/cc20/emotional_prince/logan2-1.png" width="56" height="110" border="0" name=img2></a><a href="http://prophecy.forum24.ru/?32-declanhheartbreak" onMouseOver="imgOn('img3')"; onMouseOut="imgOff('img3')"><img src="http://i218.photobucket.com/albums/cc20/emotional_prince/declan2.png" width="56" height="110" border="0" name=img3></a><br><a href="http://prophecy.forum24.ru/?32-christinekeating" onMouseOver="imgOn('img4')"; onMouseOut="imgOff('img4')"><img src="http://i218.photobucket.com/albums/cc20/emotional_prince/avri2.png" width="169" height="60" border="0" name=img4></a>
</center>
</table>
<center>

<script language="JavaScript">
if (document.images) {
img1on = new Image();
img1on.src ="http://i218.photobucket.com/albums/cc20/emotional_prince/helg1.png";
img1off = new Image();
img1off.src = "http://i218.photobucket.com/albums/cc20/emotional_prince/helg2.png";
img2on = new Image();
img2on.src ="http://i218.photobucket.com/albums/cc20/emotional_prince/logan.png";
img2off = new Image();
img2off.src = "http://i218.photobucket.com/albums/cc20/emotional_prince/logan2-1.png";
img3on = new Image();
img3on.src ="http://i218.photobucket.com/albums/cc20/emotional_prince/declan1.png";
img3off = new Image();
img3off.src = "http://i218.photobucket.com/albums/cc20/emotional_prince/declan2.png";
img4on = new Image();
img4on.src ="http://i218.photobucket.com/albums/cc20/emotional_prince/avri.png";
img4off = new Image();
img4off.src = "http://i218.photobucket.com/albums/cc20/emotional_prince/avri2.png";

}
function imgOn(imgName) {
if (document.images) {
document[imgName].src = eval(imgName + "on.src"); }}//osw
function imgOff(imgName) {
if (document.images) {
document[imgName].src = eval(imgName + "off.src"); }}
</script>

0

Поделиться45922-05-2010 22:33:32

Автор: ryu
няшечка.
Уважение: +18
Зарегистрирован: 01-09-2009
Провел на форуме:
7 дней 18 часов
Возраст: 32 [1992-03-24]
Пол: Мужской
Последний визит:
16-12-2012 17:55:39

Попытаюсь сформулировать свой вопрос, хотя по-моему не получится. Как сделать все окна прозрачными, что бы был виден только фон? Такая фича на этом форуме имеется.

0

Поделиться46022-05-2010 22:50:34

Автор: dr.bormental
1869
Уважение: +18
Зарегистрирован: 20-05-2010
Провел на форуме:
2 дня 15 часов
Пол: Мужской
Последний визит:
10-04-2012 23:47:13

Kaito
Если в своем стиле для идеального эффекта нужно прописать в style_cs.css =>>> /* CS1 Background and text colours данный элемент: background-color: transparent !important;
Пример:

/* CS1.1 */
.punbb .section .container, .punbb .post-body, .punbb .post-links, .punbb td.tc2, .punbb td.tc3,
.punbb .formal fieldset .post-box, #viewprofile li strong, #viewprofile li div, #setmods dd,
.punbb .info-box, .punbb #pun-main .info-box .legend {
background-color: transparent !important;
color: #474747;
}

/* CS1.2 */
.punbb .main .container, .punbb .post .container, .punbb .post h3, .punbb-admin #pun-admain .adcontainer {
background-color: transparent !important;
color: #474747;
}

/* CS1.3 */
#pun-stats h2, .punbb .main h1, .punbb .main h2, #pun-debug h2, .punbb-admin #pun-admain h2 {
background-color: transparent !important;
color: #474747;
font-weight: normal;
font-style: normal;
}

и т.д. вплоть до /* CS2 Border colours. Далее, если вам не требуется скрывать все границы форума, ничего не трогайте.

Лично я всегда делаю так.)

0

Поделиться46122-05-2010 22:58:17

Автор: ryu
няшечка.
Уважение: +18
Зарегистрирован: 01-09-2009
Провел на форуме:
7 дней 18 часов
Возраст: 32 [1992-03-24]
Пол: Мужской
Последний визит:
16-12-2012 17:55:39

peshe
А если не в своем стиле? Просто я нуб и в CSS ничего не смыслю, по-проще никак?

0

Поделиться46222-05-2010 23:03:00

Автор: dr.bormental
1869
Уважение: +18
Зарегистрирован: 20-05-2010
Провел на форуме:
2 дня 15 часов
Пол: Мужской
Последний визит:
10-04-2012 23:47:13

Kaito
Если не через css, там получится довольно громоздкий код, при чем практически всегда он не эффективен. В стандартных стилях все равно невозможно везде убрать заливку (особенно бесит контейнер статистики).
Я готов помочь с технической частью стиля, если что. Пишите в ЛС.

+1

Поделиться46322-05-2010 23:03:45

Автор: ryu
няшечка.
Уважение: +18
Зарегистрирован: 01-09-2009
Провел на форуме:
7 дней 18 часов
Возраст: 32 [1992-03-24]
Пол: Мужской
Последний визит:
16-12-2012 17:55:39

peshe
Ладно, спасибо))

0

Поделиться46423-05-2010 11:59:42

Автор: ЧерNый Do}!{дь
Ты умрешь в моих обьятиях
Уважение: +8
Зарегистрирован: 01-02-2010
Провел на форуме:
3 дня 17 часов
Последний визит:
01-03-2012 14:34:36

у меня несколько вопросов:
а) как сделать фон двойным (куда именно пихать коды, что бы был стоячим задник и вообще) и как сделать так, что бы фон форума был не полностью прозрачным, а полу прозрачным как в Mybb Enlighten
б) как сузить фон
в) не подскажете, куда пихать ссыль шапки, она у меня не встает т.т

0

Поделиться46523-05-2010 12:12:41

Автор: FeroDaR
Veritable
Уважение: +18
Зарегистрирован: 22-04-2010
Провел на форуме:
2 дня 0 часов
Откуда: Беларусь
Возраст: 32 [1992-05-23]
Пол: Мужской
Последний визит:
17-07-2010 11:34:53

ЧерNый Do}!{дь написал(а):

а) как сделать фон двойным (куда именно пихать коды, что бы был стоячим задник и вообще) и как сделать так, что бы фон форума был не полностью прозрачным, а полу прозрачным как в Mybb Enlighten

Может просто сделать картинку полу-прозрачной? В стиле ничего не увидел... Фон как фон..

ЧерNый Do}!{дь написал(а):

б) как сузить фон

Непонял...

ЧерNый Do}!{дь написал(а):

в) не подскажете, куда пихать ссыль шапки, она у меня не встает т.т

Код:

<style>
#pun-title, #pun-title .container {
  background-image: url(адрес шапки);
height:высота в пикселах рх;  
</style>

+1

Поделиться46623-05-2010 12:42:58

Автор: dr.bormental
1869
Уважение: +18
Зарегистрирован: 20-05-2010
Провел на форуме:
2 дня 15 часов
Пол: Мужской
Последний визит:
10-04-2012 23:47:13

ЧерNый Do}!{дь
1 & 2. фон, имеется ввиду ширина вашего полупрозрачного форума?) как уже сказали, фон под сам форум делаете полупрозрачным в фш. вставлять сюда:

/* CS1 Background and text colours
-------------------------------------------------------------*/

body {
background-color: #0b0b0b;
background-image: url(http://s46.radikal.ru/i113/1005/5c/5ad07e540d9a.jpg);
background-attachment: fixed;
}

#pun { width: 800px;
margin: auto;
background-repeat: repeat;
padding-left: 0px;
padding-right: 0px;
background-image: url(http://i067.radikal.ru/1005/a6/c59c9a31cbae.png)
}

эту ссылку заменяйте на картинку бэкграунда форума.
эту ссылку заменяйте на полупрозрачный фон форума.
ширину регулируйте в пикселях.

+ не забудьте прописать ширину форума и в самом css:

/* A5.1 */
#pun {
width : 800px;
margin: 0px auto auto auto;
position: relative;
}

Отредактировано peshe (23-05-2010 12:51:00)

+1

Поделиться46724-05-2010 11:57:26

Автор: ЧерNый Do}!{дь
Ты умрешь в моих обьятиях
Уважение: +8
Зарегистрирован: 01-02-2010
Провел на форуме:
3 дня 17 часов
Последний визит:
01-03-2012 14:34:36

peshe
FeroDaR
спасибо огромное, ща полезу разбираться
и еще один вопрос- а как поменять цвет текста 0.о

Отредактировано ЧерNый Do}!{дь (24-05-2010 13:41:24)

0

Поделиться46824-05-2010 13:48:11

Автор: dr.bormental
1869
Уважение: +18
Зарегистрирован: 20-05-2010
Провел на форуме:
2 дня 15 часов
Пол: Мужской
Последний визит:
10-04-2012 23:47:13

ЧерNый Do}!{дь написал(а):

и еще один вопрос- а как поменять цвет текста 0.о

style_cs.css ->>>

/* CS1.1 */
.punbb .section .container, .punbb .post-body, .punbb .post-links, .punbb td.tc2, .punbb td.tc3,
.punbb .formal fieldset .post-box, #viewprofile li strong, #viewprofile li div, #setmods dd,
.punbb .info-box, .punbb #pun-main .info-box .legend {
background-color: #767676;
color: #FFFFFF;
}

/* CS1.2 */
.punbb .main .container, .punbb .post .container, .punbb .post h3, .punbb-admin #pun-admain .adcontainer {
background-color: #767676;
color: #FFFFFF;
}

/* CS1.3 */
#pun-stats h2, .punbb .main h1, .punbb .main h2, #pun-debug h2, .punbb-admin #pun-admain h2 {
background-color: #767676;
color: #FFFFFF;
font-weight: normal;
font-style: normal;

}

/* CS1.4 */
#pun-title, #pun-title .container, .punbb .modmenu .container {
background-color: #767676;
color: #FFFFFF;
}

/* CS1.5 */
.punbb legend span, #viewprofile h2 span, #profilenav h2 span, .punbb-admin #pun-admain legend span {
background-color: #767676;
color: #FFFFFF
}

/* CS1.6 */
.punbb .post h3 span, .punbb th, #viewprofile li, #setmods dl {
background-color: #767676;
color: #FFFFFF
}

/* CS1.7 */
.punbb .quote-box, .punbb .code-box {
background-color: #666666;
color: #FFFFFF
}

/* CS1.8 */
#pun-navlinks .container {
background-color: #767676;
color: #030303;
}

.offline li.pa-online strong {
font-weight: normal
}

.punbb textarea, .punbb select, .punbb input {
background-color: #767676;
color: #FFFFFF
}

зеленым обозначен цвет текста на форуме.
красным - цвет ссылок в меню навигации.

Отредактировано peshe (24-05-2010 13:48:37)

0

Поделиться46924-05-2010 14:42:14

Автор: ЧерNый Do}!{дь
Ты умрешь в моих обьятиях
Уважение: +8
Зарегистрирован: 01-02-2010
Провел на форуме:
3 дня 17 часов
Последний визит:
01-03-2012 14:34:36

peshe
спасибо огромное еще раз

0

Поделиться47024-05-2010 16:22:04

Автор: Olariel
пушистая.
Уважение: +418
Зарегистрирован: 03-11-2009
Провел на форуме:
15 дней 3 часа
Возраст: 33 [1991-04-29]
Пол: Женский
ICQ: 452576228
Mail Agent: koshechka-666666@list.ru
Последний визит:
21-01-2013 20:04:22

В общем, вопроса у меня два.
1) Вот там где обведено красным как убрать эти более темного цвета границы?
2) Как между блоками залить цветом так, что бы тело форума было сплошным цветом, как на АА

0

Поделиться47124-05-2010 16:50:25

Автор: Gilgamesh
/)^3^(\
Уважение: +866
Зарегистрирован: 09-06-2009
Провел на форуме:
1 месяц 16 дней
Возраст: 26 [1998-07-02]
Пол: Женский
ICQ: 5306449
Skype: hinokuromu
Последний визит:
02-01-2013 18:59:35

Rrotarr написал(а):

1) Вот там где обведено красным как убрать эти более темного цвета границы?

убрать рамки вообще.

Rrotarr написал(а):

2) Как между блоками залить цветом так, что бы тело форума было сплошным цветом, как на АА

на аа фон такой. Ещё вариант — заливка pun

0

Поделиться47224-05-2010 16:59:14

Автор: Olariel
пушистая.
Уважение: +418
Зарегистрирован: 03-11-2009
Провел на форуме:
15 дней 3 часа
Возраст: 33 [1991-04-29]
Пол: Женский
ICQ: 452576228
Mail Agent: koshechka-666666@list.ru
Последний визит:
21-01-2013 20:04:22

клубничная принцесса= написал(а):

убрать рамки вообще.

Кхем как?

клубничная принцесса= написал(а):

на аа фон такой. Ещё вариант — заливка pun

Где сие pun найти? Куда вставлять и т.д?

0

Поделиться47324-05-2010 17:03:26

Автор: Gilgamesh
/)^3^(\
Уважение: +866
Зарегистрирован: 09-06-2009
Провел на форуме:
1 месяц 16 дней
Возраст: 26 [1998-07-02]
Пол: Женский
ICQ: 5306449
Skype: hinokuromu
Последний визит:
02-01-2013 18:59:35

Rrotarr написал(а):

Кхем как?

а часто задаваемые вопросы прочить не дано?

Rrotarr написал(а):

Где сие pun найти? Куда вставлять и т.д?

Код:

#pun {background-color: #цвет; }

0

Поделиться47424-05-2010 17:34:50

Автор: dr.bormental
1869
Уважение: +18
Зарегистрирован: 20-05-2010
Провел на форуме:
2 дня 15 часов
Пол: Мужской
Последний визит:
10-04-2012 23:47:13

Rrotarr написал(а):

Кхем как?

/* CS2 Border colours
-------------------------------------------------------------*/

где стоит border-color: ... меняете на border-color: transparent !important;

Отредактировано peshe (24-05-2010 17:35:58)

+1

Поделиться47524-05-2010 18:19:22

Автор: Olariel
пушистая.
Уважение: +418
Зарегистрирован: 03-11-2009
Провел на форуме:
15 дней 3 часа
Возраст: 33 [1991-04-29]
Пол: Женский
ICQ: 452576228
Mail Agent: koshechka-666666@list.ru
Последний визит:
21-01-2013 20:04:22

peshe написал(а):

где стоит border-color: ... меняете на border-color: transparent !important;

Благодарю!

0

Поделиться47624-05-2010 19:51:46

Автор: картонка'
абракадабра, хуле.
Уважение: +33
Зарегистрирован: 13-11-2009
Провел на форуме:
2 дня 5 часов
Возраст: 29 [1994-12-04]
Пол: Женский
Последний визит:
29-03-2013 17:47:24

Еще раз прошу прощения. Можете подсказать, как сделать такой эффект, для середины форума. Она белая, но в тоже время прозрачная и проглядывает фон.

Код:

/* CS1.5 */
.punbb legend span, #viewprofile h2 span, #profilenav h2 span, .punbb-admin #pun-admain legend span 
{
color: transparent
  }

- это ничего не дает оО

0

Поделиться47724-05-2010 20:13:15

Автор: Wilhelm
Angelus Domini
Уважение: +484
Зарегистрирован: 30-09-2009
Провел на форуме:
25 дней 4 часа
Возраст: 36 [1988-01-24]
Пол: Мужской
Последний визит:
30-09-2012 13:55:02

Beatris
Есть два способа добиться такого эффекта:
1. Сделать форум прозрачным (см. FAQ) + прописать в подложку полупрозрачную png-картинку (код: #pun{background-color: transparent; background-image: url(картинка);})
2. нарисовать и отредактировать требуемый фон в фотошопе, как и делают ненормальные создатели подобных фонов: http://i41.tinypic.com/a10j1j.jpg
Поставить этот извратский фон можно с помощью кода:

body {
background-image : url("катинка");
background-color : #цвет;
background-position: center;
background-attachment : fixed;
}

Кстати, а к чему вы привели код? О_о Точнее - к какому из вопросов? Ибо настройки админки и профиля тут ни при чем )

0

Поделиться47825-05-2010 12:15:57

Автор: #.FlosinG
активный пользователь
Уважение: +0
Зарегистрирован: 23-04-2010
Провел на форуме:
1 час 38 минут
Последний визит:
29-10-2010 15:42:43

http://type.win-x.su/

Доброго времени суток..у меня тут пару вопросов))

1) Как поместить рекламу в самый вверх, т.е. до шапки?
2) Как убрать название форума с шапки? В CSS

0

Поделиться47925-05-2010 12:24:40

Автор: FeroDaR
Veritable
Уважение: +18
Зарегистрирован: 22-04-2010
Провел на форуме:
2 дня 0 часов
Откуда: Беларусь
Возраст: 32 [1992-05-23]
Пол: Мужской
Последний визит:
17-07-2010 11:34:53

2) Как убрать название форума с шапки? В CSS

Код:

<style>
#pun-title .title-logo span  {display: none;}
</style>

0

Поделиться48025-05-2010 13:52:07

Автор: #.FlosinG
активный пользователь
Уважение: +0
Зарегистрирован: 23-04-2010
Провел на форуме:
1 час 38 минут
Последний визит:
29-10-2010 15:42:43

FeroDaR написал(а):

<style>
#pun-title .title-logo span {display: none;}
</style>

Как не странно..но она сама исчезла! Оо И без скрипта...

Образовался ещё один вопрос.

1) Каким образов выравнить картинку в навигпции?

0

Alternative Art : breath of a phoenix

Меню навигации

Пользовательские ссылки

Информация о пользователе

Вопросы/проблемы со стилем vol.02>>

Сообщений 451 страница 480 из 1000

Поделиться45120-05-2010 19:16:52

Поделиться45220-05-2010 19:46:09

Поделиться45321-05-2010 01:05:35

Поделиться45421-05-2010 06:53:38

Поделиться45521-05-2010 10:50:47

Поделиться45621-05-2010 13:08:23

Поделиться45721-05-2010 19:36:23

Поделиться45821-05-2010 19:42:35

Поделиться45922-05-2010 22:33:32

Поделиться46022-05-2010 22:50:34

Поделиться46122-05-2010 22:58:17

Поделиться46222-05-2010 23:03:00

Поделиться46322-05-2010 23:03:45

Поделиться46423-05-2010 11:59:42

Поделиться46523-05-2010 12:12:41

Поделиться46623-05-2010 12:42:58

Поделиться46724-05-2010 11:57:26

Поделиться46824-05-2010 13:48:11

Поделиться46924-05-2010 14:42:14

Поделиться47024-05-2010 16:22:04

Поделиться47124-05-2010 16:50:25

Поделиться47224-05-2010 16:59:14

Поделиться47324-05-2010 17:03:26

Поделиться47424-05-2010 17:34:50

Поделиться47524-05-2010 18:19:22

Поделиться47624-05-2010 19:51:46

Поделиться47724-05-2010 20:13:15

Поделиться47825-05-2010 12:15:57

Поделиться47925-05-2010 12:24:40

Поделиться48025-05-2010 13:52:07