Поддержка всех форумов о природе

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

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


Вы здесь » Поддержка всех форумов о природе » "Парта и стул" » Солне и цветы (для Sunflower)


Солне и цветы (для Sunflower)

Сообщений 1 страница 10 из 43

1

Ну Санни, чему ты хочешь научится?

0

2

для начала я бы хотел разобраться с кодом цветов. Вот с форума, над которым я работаю:

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

/* CS1.1 */
html, body {background-color: #ffffff; background-image: url(http://xmages.net/storage/10/1/0/2/d/upload/5413e918.gif); background-repeat: repeaty; background-attachment: fixed; background-position: center; color: black;}
BODY {background:fixed;}

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

/* CS1.3 */
#pun-stats h2, .punbb .main h1, .punbb .main h2, #pun-debug h2, .punbb-admin #pun-admain h2 {
  background-image : url(http://xmages.net/storage/10/1/0/4/f/upload/60022053.png);
  color: #fff;
font-style: italic;
font-family: Arial Narrow;
text-align: center;
  }

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

#pun-title  .title-logo{background: url(http://xmages.net/storage/10/1/0/5/2/upload/c41d7303.png) no-repeat top center; padding: 0px;}
#pun-title table {
background: url() repeat-x;
background-position: 0px 1px;
}

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

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

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

/* CS1.8 */
#pun-navlinks .container {
  background-color: #0F5995;
  color: #f1f1f1;
  }

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

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

/* CS2.1 */
.punbb .container, .punbb .post-body, .post h3, #pun-title {
  border-color: #ccc #ccc #aaa #ccc
  }

/* CS2.2 */
.punbb .section, .punbb .forum, .punbb .formal, .punbb .modmenu, .punbb .info,
.punbb .category, .punbb .post {
  border-color: #f5f5f5
  }

/* CS2.3 */
#pun-stats h2, .punbb .main h1, .punbb .main h2, #pun-debug h2, .punbb-admin #pun-admain h2 {
  border-color: #004F90;
  }

/* CS2.4 */
.punbb td, .punbb fieldset, #viewprofile ul, #profilenav ul, .punbb .post .post-body,
.punbb .post h3 span, .post-links ul, .post-links, .usertable table {
  border-color: #C9D6E0;
  }

/* CS2.5 */
.punbb th {
  border-color: #dedfdf
  }

/* CS2.6 */
.punbb .quote-box, .punbb .code-box {
  border-color: #ccc #fff #fff #ccc;
  }

#pun-ulinks li, #pun-announcement h2 span, li#onlinelist, #pun-help .formal .info-box h3.legend span {
  border-color: #ccc
  }

#pun-ulinks li a, #pun-announcement h2, li#onlinelist div, #pun-help .formal .info-box h3.legend {
  border-color: #fff
  }

.punbb .divider {
  border-color: #ccc #fff #fff #fff
  }

.punbb .formal fieldset .post-box, .punbb .info-box {
  border: 1px solid #dedfdf
  }

li.pa-online {
  border-left-color: #005EAB;
  }


/* CS3 Links
-------------------------------------------------------------*/

/* CS3.1 */
.punbb a, .punbb a:link, .punbb a:visited,
.punbb-admin #pun-admain a, .punbb-admin #pun-admain a:link, .punbb-admin #punbb-admain a:visited {
  color: #005EAB
  }

.punbb li.isactive a, .punbb li.isactive a:link, .punbb li.isactive a:visited {
  color: #333
  }

/* CS3.2 */
.punbb a:hover, .punbb a:focus, .punbb a:active,  .punbb-admin #pun-admain .nodefault,
.punbb-admin #punbb-admain a:hover, .punbb-admin #punbb-admain a:focus, .punbb-admin #punbb-admain a:active {
  color: #B42000;
  }

/* CS3.3 */
#pun-navlinks a {
  color: #eee;
  text-decoration: none
  }

/* CS3.4 */
#pun-navlinks a:hover, #pun-navlinks a:focus, #pun-navlinks a:active {
  color: #fff;
  text-decoration: underline
  }

#pun-pagelinks a:active, #pun-pagelinks a:focus {
  background-color: #333;
  color: #fff;
  }

/* CS4 Post status icons
 -------------------------------------------------------------*/

div.icon {
        background: url(http://xmages.net/storage/10/1/0/a/c/upload/4ac5aec8.gif) no-repeat;
}

tr.inew div.icon {
        background: url(http://xmages.net/storage/10/1/0/2/4/upload/e49e8568.gif) no-repeat;
}

tr.iclosed div.icon {
        background: url(http://xmages.net/storage/10/1/0/c/9/upload/f7e9ec92.gif) no-repeat;
}

tr.iredirect div.icon {
        background: url(http://xmages.net/storage/10/1/0/8/6/upload/bf44d634.gif) no-repeat;
}

tr.isticky div.icon {
        background: url(http://xmages.net/storage/10/1/0/8/6/upload/bf44d634.gif) no-repeat;
}

#pun-main div.catleft, #pun-main div.catright {display: none}

#pun-about p.container {background-image: url("http://xmages.net/storage/10/1/0/5/4/upload/1dab5ab0.jpg"); background-repeat: no-repeat; height: 250px;}

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

0

3

с ответом не тороплю, можно(даже желательно) постепенно, чтоб всё в голове отложилось и больше методом тыка работать не пришлось.

0

4

А ты откуда взяла эти коды

0

5

сам тестовик - http://rictest.mybb.ru/
Администрирование-->Стиль--->Цвета style_cs.css

0

6

А ты нек хочешь заново свой стиль сделать? Ты фш владеешь?

0

7

в смысле? опять с нуля. Фотошопом я владею - все элементы на тестовике собственного производства. Даже как-то умудрился таблицу сделать.
но могу зарегистрировать ещё один сайт исключительно для наших уроков^^

0

8

-Что такое дизайн для форума? Это его внешний вид. Так вот, для этого мы должны понять, что лежит в основе построения(написания) стиля для форума!? Правильно, это его структура. Но сначала мы постараемся сделать только цвета для нашего форума, а структуру подобрать. Начнем с самого малого. Для написания стиля нам понадобиться некоторые программки. Это:
http://www.radikal.ru/
- Радикал (можно савип ру, но мне радикал ближе)
http://0pk.ru/generator/
- Генератор стилей оформления. (чтобы не писать код целиком)
http://my forumnamename.mybbl.ru/
- Ваш форум- тестовик (для того, что бы тестировать стили.)
И ещё, никакого русского не должно быть в коде.
Начальные понятия:
Структура - style.css
Цвета - style_cs.css

И так, приступим к изучению. Структуру вы увидите потом, но для начала, чтобы понять как делать стиль, вы должны сделать пару штук под заказ. С опытом работы все лучше и лучше становятся. Вот ваш план действий по цветам:
1) Поставить фон
2) Поставить шапку
3) Сделать иконки
4) Стиль готов!
А что такое цвета и структура?

Структура:
Это как скелет форума. Там все основное.
Цвета:
Вот это уже более широкое понятие. Это все иконки, шапка, цвета....

Как работать с генератором стилей оформления?

Зайдите по ссылке генератора, которую я вам дала. Там есть окошко. В нем написано: Сгенерировать стиль основываясь на цвете ... и потом окошко с цветом. Выбираете свой цвет. И нажимаете кнопку "Генерация". Если вам не понравилось, вы можете попробовать "инвертировать", то есть сделать стиль наоборот. Для этого нужно поставить галочки на двух местах.  И нажать генерацию. Понятно. Но если результат вам понравился, то переходим в следующую вкладку: "Разное". Там написано:
Настройки страницы
Под ним всякие настройки. Ставите на свое. И ещё одно примечание: если стиль инвертированный, то цвет текста измените НЕ НА БЕЛЫЙ. Если вы этого не сделаете, тогда текст не будет видно. Текст форума должен совпадать по цвету с текстом в шапке! После того, как ввели настройки, переходим во вкладку "Стили ссылок". В ней написан подраздел "Начальное состояние". Это когда ссылке не подвергается наведению курсора. Делаете настройки. А в подразделе "При наведении курсора"
это состояние ссылки при наведении курсора на неё. Далее. Переходим в окошко "Стили меню".
Там делаем тоже самое, что и с ссылками, только это уже меню (форум, участники...).
Если вы все закончили, то нажимаете в окошке "Основное" кнопку "Сохранить стиль". И копируете код. После того, как его скопируете вставьте его в эту тему. А я скажу что делать дальше.

0

9

Я тебе кое что выложила попробуй сделать пока это!

0

10

ладно, спасибо. Щас из-за компа выгоняют. Принцип я поняла, отчитаюсь по-нормальному завтра, если успею^^ещё раз спасибо, что взялась за меня

0

Быстрый ответ

Напишите ваше сообщение и нажмите «Отправить»





Вы здесь » Поддержка всех форумов о природе » "Парта и стул" » Солне и цветы (для Sunflower)