Единый форум поддержки

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

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

Вы здесь » Единый форум поддержки » Архив » Как изменить цвет

Как изменить цвет

Страница: 1

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

1

  • Автор: Вдумчивый
  • Заслуженный
  • Вдумчивый
  • Зарегистрирован: Чт, 5 Янв 2012
  • Сообщений: 631
  • Уважение: +82
  • Позитив: +156
  • Пол: Мужской
  • Последний визит:
    Ср, 6 Сен 2023 17:48:26

Ребята, подскажите, как изменить цвет в выпадающем меню - шрифта и фона: :flag:

http://file-up.net/big_0cab14a94f30909ab420131208065421.jpg

0

2

  • Автор: Вдумчивый
  • Заслуженный
  • Вдумчивый
  • Зарегистрирован: Чт, 5 Янв 2012
  • Сообщений: 631
  • Уважение: +82
  • Позитив: +156
  • Пол: Мужской
  • Последний визит:
    Ср, 6 Сен 2023 17:48:26

http://visitorfriend.ru/

0

3

  • Автор: Reysler
  • LastMan
  • Reysler
  • Зарегистрирован: Вт, 9 Дек 2008
  • Сообщений: 3744
  • Уважение: +2603
  • Позитив: +884
  • Пол: Мужской
  • Последний визит:
    Вчера 19:41:25

Вдумчивый
Идем в админку: Администрирование - Настройки. На клавиатуре жмем Ctrl+F, должно открыться окно или поле поиска, в него вставляем строчку

#pun-navlinks ul li ul

Поиск нам выделит соответствующий код, расположенный в поле HTML-верх:

#pun-navlinks ul li ul {
  width: 175px;
  display: none;
  position: absolute;
  z-index: 90;
  top: 30px;
  left: -35px;
  background-color: #111;
background-image: -moz-linear-gradient(#444, #111); background-image: -webkit-gradient(linear, left top, left bottom, from(#444), to(#111)); background-image: -webkit-linear-gradient(#444, #111); background-image: -o-linear-gradient(#444, #111);background-image: -ms-linear-gradient(#444, #111);background-image: linear-gradient(#444, #111);
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  -khtml-border-radius: 10px; 
  border-radius: 10px;
  -moz-box-shadow: 0 1px 1px #777, 0 1px 0 #666 inset;-webkit-box-shadow: 0 1px 1px #777, 0 1px 0 #666 inset;box-shadow: 0 1px 1px #777, 0 1px 0 #666 inset;
}

Там нам понадобятся следующие строчки:

Код:
background-color: #111;
background-image: -moz-linear-gradient(#444, #111);
background-image: -webkit-gradient(linear, left top, left bottom, from(#444), to(#111));
background-image: -webkit-linear-gradient(#444, #111);
background-image: -o-linear-gradient(#444, #111);
background-image: -ms-linear-gradient(#444, #111);
background-image: linear-gradient(#444, #111);

Разберем что к чему. Основной цвет прописан в

background-color: #111;

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

background-image: -moz-linear-gradient(#444, #111);
background-image: -webkit-gradient(linear, left top, left bottom, from(#444), to(#111));
background-image: -webkit-linear-gradient(#444, #111);
background-image: -o-linear-gradient(#444, #111);
background-image: -ms-linear-gradient(#444, #111);
background-image: linear-gradient(#444, #111);

Выделенное красным - фон сверху, выделенное синим - фон снизу.

Отредактировано Reysler (Вс, 8 Дек 2013 11:01:25)

0

4

  • Автор: Вдумчивый
  • Заслуженный
  • Вдумчивый
  • Зарегистрирован: Чт, 5 Янв 2012
  • Сообщений: 631
  • Уважение: +82
  • Позитив: +156
  • Пол: Мужской
  • Последний визит:
    Ср, 6 Сен 2023 17:48:26
Reysler написал(а):

Вдумчивый
Идем в админку: Администрирование - Настройки. На клавиатуре жмем Ctrl+F, должно открыться окно или поле поиска, в него вставляем строчку

    #pun-navlinks ul li ul

Поиск нам выделит соответствующий код, расположенный в поле HTML-верх:

    #pun-navlinks ul li ul {
      width: 175px;
      display: none;
      position: absolute;
      z-index: 90;
      top: 30px;
      left: -35px;
      background-color: #111;
    background-image: -moz-linear-gradient(#444, #111); background-image: -webkit-gradient(linear, left top, left bottom, from(#444), to(#111)); background-image: -webkit-linear-gradient(#444, #111); background-image: -o-linear-gradient(#444, #111);background-image: -ms-linear-gradient(#444, #111);background-image: linear-gradient(#444, #111);
      -moz-border-radius: 10px;
      -webkit-border-radius: 10px;
      -khtml-border-radius: 10px;
      border-radius: 10px;
      -moz-box-shadow: 0 1px 1px #777, 0 1px 0 #666 inset;-webkit-box-shadow: 0 1px 1px #777, 0 1px 0 #666 inset;box-shadow: 0 1px 1px #777, 0 1px 0 #666 inset;
    }

Там нам понадобятся следующие строчки:
Код:

background-color: #111;
background-image: -moz-linear-gradient(#444, #111);
background-image: -webkit-gradient(linear, left top, left bottom, from(#444), to(#111));
background-image: -webkit-linear-gradient(#444, #111);
background-image: -o-linear-gradient(#444, #111);
background-image: -ms-linear-gradient(#444, #111);
background-image: linear-gradient(#444, #111);

Разберем что к чему. Основной цвет прописан в

    background-color: #111;

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

    background-image: -moz-linear-gradient(#444, #111);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#444), to(#111));
    background-image: -webkit-linear-gradient(#444, #111);
    background-image: -o-linear-gradient(#444, #111);
    background-image: -ms-linear-gradient(#444, #111);
    background-image: linear-gradient(#444, #111);

Выделенное красным - фон сверху, выделенное синим - фон снизу.

Отредактировано Reysler (Сегодня 11:01:25)

Идея. конечно, хорошая, но убей - не пойму...
так все-таки, как изменить... Не получается. Мне бы нужно так , как здесь на форуме. :flag:

Отредактировано Вдумчивый (Вс, 8 Дек 2013 13:21:11)

0

5

  • Автор: kolobdur74
  • ...
  • kolobdur74
  • Зарегистрирован: Пн, 6 Сен 2010
  • Сообщений: 7523
  • Уважение: +6083
  • Позитив: +6639
  • Пол: Мужской
  • Последний визит:
    Вчера 15:31:36
Вдумчивый написал(а):

Ребята, подскажите, как изменить цвет в выпадающем меню - шрифта и фона:

В НТМЛ верх:

<style>
ul#userpol li a {
color: #111 !important;
font-size: 14px !important;
font-family: Geneva, Arial, Helvetica, sans-serif !important;
font-weight: 600 !important;
z-index: 1000;
}
ul#userpol li:hover a {
background: #555;
color: #ffcc33 !important;
font-size: 14px !important;
font-family: Geneva, Arial, Helvetica, sans-serif !important;
font-weight: 600 !important;
}
</style>

Где:
color: #111 !important; - цвет шрифта
font-size: 14px !important; - размер шрифта
font-family: Geneva, Arial, Helvetica, sans-serif !important; - семейство шрифта
font-weight: 600; - жирность шрифта

ul#userpol li:hover a - при наведении
background: #555; - фон шрифта

+1

6

  • Автор: kolobdur74
  • ...
  • kolobdur74
  • Зарегистрирован: Пн, 6 Сен 2010
  • Сообщений: 7523
  • Уважение: +6083
  • Позитив: +6639
  • Пол: Мужской
  • Последний визит:
    Вчера 15:31:36

Как здесь:

Код:
<style>
ul#userpol {
padding: 0px 0px 12px 0px;
width: 290px;
list-style: none;
display: none;
position: absolute;
top: 24px;
left: -5px;
border: 1px solid #222;
background-color: #111;
background-image: -moz-linear-gradient(#444, #111);
background-image: -webkit-gradient(linear, left top, left bottom, from(#444), to(#111));
background-image: -webkit-linear-gradient(#444, #111);
background-image: -o-linear-gradient(#444, #111);
background-image: -ms-linear-gradient(#444, #111);
background-image: linear-gradient(#444, #111);
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
border-radius: 6px;
-moz-box-shadow: 0 1px 1px #777, 0 1px 0 #666 inset;
-webkit-box-shadow: 0 1px 1px #777, 0 1px 0 #666 inset;
box-shadow: 0 1px 1px #777, 0 1px 0 #666 inset;
}

ul#userpol li a{
color: #fff;
text-decoration: none;
font-variant: small-caps;
background: none;
font-size: 1em;
}

ul#userpol li:hover a {
background-color: #0186ba;
background-image: -moz-linear-gradient(#04acec, #0186ba);
background-image: -webkit-gradient(linear, left top, left bottom, from(#04acec), to(#0186ba));
background-image: -webkit-linear-gradient(#04acec, #0186ba);
background-image: -o-linear-gradient(#04acec, #0186ba);
background-image: -ms-linear-gradient(#04acec, #0186ba);
background-image: linear-gradient(#04acec, #0186ba);
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
border-radius: 6px;
-moz-transition: background-color 0.01s;
-webkit-transition: background-color 0.01s;
-o-transition: background-color 0.01s;
transition: background-color 0.01s;
}
</style>

+1

7

  • Автор: Вдумчивый
  • Заслуженный
  • Вдумчивый
  • Зарегистрирован: Чт, 5 Янв 2012
  • Сообщений: 631
  • Уважение: +82
  • Позитив: +156
  • Пол: Мужской
  • Последний визит:
    Ср, 6 Сен 2023 17:48:26

С П А С И Б О !!! :cool:

0

Страница: 1

Вы здесь » Единый форум поддержки » Архив » Как изменить цвет