Фабрика Дизайна

Объявление

Форум переезжает!!!!!!! Все заказы оставляем теперь сдесь:av.bestff.ru
Всем привет!! приветствуем вас на нашем форуме!! Зедесь вы можете заказать шапки, баннеры, стили, ранги, статусы, аватары, кнопочки, иконки, наградки, подписи. и многое многое другое!! Администрация:

MarishkA
Vredin@

Модераторы: Идет Набор!

Мастера:
MIX
ДеВоЧкА ЛеТо
klu4ik
Скрипт Мастера:
К@V@ЙнаЯ К()шК@

Архивариусы:
Идет набор!
контентщики:
Идет набор!
Рекламщики:Lenok, Roman, Лера Козлова, идет набор
На данный момент форум только начал свою работу, поэтому заказывайте, нам очень нужны ваши заказы!! Конкурсы;проводится конкурс на лучший баннер Идет набор мастеров!! кто придет к нам в мастера, получит красивый статус, и возможность выполнять заказы, заявки оставлять в подобающей теме

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

Привет, Гость! Войдите или зарегистрируйтесь.


Вы здесь » Фабрика Дизайна » Делаем Стиль » второй курс


второй курс

Сообщений 1 страница 30 из 70

1

мм.. вот мы сделали в генераторе скелетик, сейчас будем регулировать ширину.

в верхнем окошке стиля ищем такой код.

Код:
/* A5 Basic page layout and borders
-------------------------------------------------------------*/

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

/* A5.2 */
.punbb {
  float: center;
  width: 100%;
  height: auto;
  }
Код:
width : 1000px;

это ширина форума. ее ставим такую же как ширина шапки, больше ничего не трогаем.

Дальше встроим иконки. в самом низу второго окошка видим

Код:
/* CS4 Post status icons
 -------------------------------------------------------------*/

стираем все что после этого заголовка, вместо этого ставим такой код

Код:
div.icon {
        background: url(Нет новых сообщений ) no-repeat;
}
tr.inew div.icon {
        background: url(Есть новые сообщения) no-repeat;
}
tr.iclosed div.icon {
        background: url(Закрытая тема) no-repeat;
}
tr.iredirect div.icon {
        background: url(Важная тема) no-repeat;
}
tr.isticky div.icon {
        background: url(раздел с ссылкой на другой источник) no-repeat;
}

и ставим вместо надписей ссылки на иконки.

встраиваем фон. в самом начале второго окошка видим

Код:
/* CS1 Background and text colours
-------------------------------------------------------------*/

после этого идет

Код:
body {
background-color;цвет
}

меняем этот код на

Код:
body {
background-image: url(адрес вашей картинки);
}

вместо слова пишем ссылку на картинку фона

встраиваем панельку.

ищем в нижнем окошке

Код:
/* CS1.3 */
#pun-stats h2, .punbb .main h1, .punbb .main h2, #pun-debug h2, .punbb-admin #pun-admain h2 {
  background-color: #DD7744;
  color: #FFFFEE;
  font-weight: normal;
font-style: normal;

  }

меняем на

Код:
/* CS1.3 */
#pun-stats h2, .punbb .main h1, .punbb .main h2, #pun-debug h2, .punbb-admin #pun-admain h2 {
  background-image: url(адрес вашей панельки);
  color: #FFFFFF;
  font-weight: normal;
font-style: normal;

  }

и самое страшное (когда я училась делать стиль мне было очень сложно)

встраиваем шапку.

ищем в нижнем окошке

Код:
/* CS1.4 */
#pun-title, #pun-title .container, .punbb .modmenu .container {
  background-color цвет;
  color: #771100;
  }

меняем на

Код:
/* CS1.4 */
#pun-title, #pun-title .container, .punbb .modmenu .container {
  background-image: url(адрес вашей шапки);
  color: #771100;
  }

теперь идем в верхнее окошко.

ищем там код

Код:
/* D1 Logo and description
-------------------------------------------------------------*/

/* D1.1 */
#pun-title {
  margin: 0;
  border-style: solid solid none solid;
  border-width: 1px 1px 0 1px;
  }

/* D1.2 */
#pun-title h1 {
  display : block;
  height : 176px;
  padding: 2em 1em 0 1em;
  }

/* D1.3 */
#pun-title .container {
  border-style: none solid none solid;
  }

/* D1.4 */
#pun-title h1 span  {
  font-size: 1.5em;
  }

#pun-title table {
	border: none;
	height: 60px;
	width: 100%;
}

#pun-title td.title-logo-tdl {
	border: none;
	width: 100%;
}

#pun-title td.title-logo-tdr {
	border: none;
	width: 468px;
}

те кто делал по первому курсу поставьте все так как у меня. ну а на всякий случай

/* D1.2 */
#pun-title h1 {
  display : block;
  height : 176px;
  padding: 2em 1em 0 1em;
  }

выделенное красным меняем на высоту шапки

вроде все. короч че не получится пишите, а получится выкладывайте скрины

0

2

Я чет ниче не поняла

0

3

Lenok
не могу не взесть, не ургайте меня...
я конечно не админ, но в css разбираюсь... можешь конкретнее что и где ты не поняла?...по пунктам...будем разбираться))

0

4

Lenok
вроде все по полочкам разложила..

0

5

Я просто в css ни бум бум

0

6

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

Я просто в css ни бум бум

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

0

7

Че?

0

8

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

0

9

Чет не выходит, ну я потом попробую

0

10

http://s54.radikal.ru/i145/0905/b5/99a46905766ct.jpg
вот что у мя получилось))))

0

11

К@V@ЙнаЯ К()шК@
а можешь отскринить еще чтоб были видны панелька и иконки?

0

12

MarishkA
обязательно

0

13

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

стираем все что после этого заголовка, вместо этого ставим такой код

вот тут у меня ничего не получилось, икончи не ставятся вообще исчезли.

0

14

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

вот тут у меня ничего не получилось, икончи не ставятся вообще исчезли.

Видимо до этого что то сделала не правильно

0

15

ДеВоЧкА ЛеТо написал(а):

Видимо до этого что то сделала не правильно

Код:
/* CS4 Post status icons
 -------------------------------------------------------------*/
div.icon {
        background: url(http://s45.radikal.ru/i107/0905/9a/561f06516b85.gif )no-repeat;
}
tr.inew div.icon {
        background: url(http://s54.radikal.ru/i145/0905/00/eec7a035e6cf.gif) no-repeat;
}
tr.iclosed div.icon {
        background: url(http://s45.radikal.ru/i108/0905/31/95572e50bc0c.gif) no-repeat;
}
tr.iredirect div.icon {
        background: url(http://s44.radikal.ru/i105/0905/04/08e361bae68a.gif) no-repeat;
}
tr.isticky div.icon {
        background: url(http://s45.radikal.ru/i108/0905/31/95572e50bc0c.gif) no-repeat;
}

вот такой код, ненаю что не правильно...

0

16

Sella
первое окошко, находишь вот это:
/* C2.15 */
.punbb div.icon {
  border-style: solid;
  border-width: 0.6em 0.6em 0.6em 0.6em;
  height: 0px;
  line-height: 0.0;
  margin-top: 0.1em;
  width: 0px;
  }
подчеркнутое меняешь на свое значение, если нет px то приписать обязательно

Отредактировано =ёЖиГ v ТумaNe= (2009-05-12 18:14:33)

0

17

=ёЖиГ v ТумaNe=
спасибо, подействовало. Но одна проблемка, теперь иконки 50х50 а высота как бы сказать где название подфорума осталось таким же и икончи заходит одна на другую потому что не помещаются. где это устанавить? И еще я бы хотела поменять ленейку меню там где участники, войти, регистрация.

0

18

Sella
там же.
/* C2.15 */
.punbb div.icon {
  border-style: solid;
  border-width: 0.6em 0.6em 0.6em 0.6em;
  height: 0px;
  line-height: 0.0;
  margin-top: 0.1em;
  width: 0px;
  }

эмь...не помню...но вроде бы вот:
#pun-navlinks .container {background-color: цвет; background-image:url(картинка, если надо);}

поищи во втором окошке  вот этот эелемент  и удали его, только название, то, что в фигурных скобках, если есть что-то еще через запятой, не трогай, а то я точно не помню, где в генераторе это находится...
#pun-navlinks .container

0

19

=ёЖиГ v ТумaNe= написал(а):

margin-top: 0.1

я ввела вместо 0.1, 5.1. и вышло такое, что лучше бы этого не видеть. короче ширена не изменилась, а иконки уползли вниз.........

0

20

http://roy.mybb.ru/
Вот если нужно, фор на котором я пытаюсь сделать стиль и тут видно что у меня с иконками...

0

21

Sella
Оо весело, однако...тада пойдем другим путем))
удаляешь все,что под этим
/* C2.14 */
и эту строку тоже и вставляешь на то место вот это:

* html .tclcon {height: 1px}

/* C2.14 */
.punbb td div.tclcon {
  margin-left: 55px;
}

/* C2.15 */
.punbb div.icon {
  float: left;
  display: block;
  width: 50px;
  height: 50px;
  padding-top: 1px;
}

Отредактировано =ёЖиГ v ТумaNe= (2009-05-14 17:09:12)

0

22

нефига не получилось...

0

23

Sella
как это не получилось? Оо я специально перепроверила...так, давай я зарегистрируюсь ты меня админкой поставишь и я те все сделаю, ок?

0

24

=ёЖиГ v ТумaNe=
давай. может я пока там делала, че-ни случайно стерла или не так сделала...

0

25

Sella
все, поставила))

0

26

=ёЖиГ v ТумaNe=
пасибо большое, а в чем была проблема?(что бы со следующим стилем знать)

0

27

Sella
да там, ты просто следующий столбик не удалила))

0

28

Я чет ничего не понимаю...у меня в конце выскакивает вот это
http://i41.tinypic.com/a1qn1w.jpg

0

29

Как еще сделать что бы стиль был по центру, а то когда я меняю размер, форум слева становится...

0

30

klu4ik
копируешь этот код, идешь в администрирование/стиль/ стираешь все из второго окошка и вставляешь  скопированное в пустое окошка/ жмешь да, использовать свой стиль и сохраняешь дальше уже поработай с тем, что админка выложила в уроке))
Sella
м? у тебя форум не должен смещатся...ты ведь в первом окошке меняешь, как в уроке сказано?

0


Вы здесь » Фабрика Дизайна » Делаем Стиль » второй курс


Рейтинг форумов | Создать форум бесплатно