Перейти к содержанию
anzhelika0505

Пропал цвет после 10 категории на главной странице,дальше пошел прозрачный фон. Помогите настроить...Спасибо

Рекомендуемые сообщения

Дайте ссылку на сайт

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
Скрытый текст
#menu .nav > li:nth-child(10) a {
  1. background-color: #0054A6;
}

Продолжайте в том же духе: 11, 12, 13, 14

http://htmlbook.ru/css/nth-child

Если 5 цветов, то лучше сделать стили типа:

5n, 5n+1, 5n+2,5n+3,5n+4 вместо старых номерных

Изменено пользователем jaffagold

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Спасибо, а подскажите еще плиз в stylesheet менять?

 

 

нахожу только это 

 

}#menu li li.active > a:last-child {
    color: #FFFFFF;
}
#menu li li.active a:last-child:before {
    margin-left: 20px;
    margin-right: 10px;

Изменено пользователем anzhelika0505

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

конечно

можете потренироваться в Инспекторе кода, если пользовались

( Правый щелчок на странице- Просмотреть код) Там можно вводить свои стили

и проверять как они работают

Скрытый текст

58f79eb94a661_.thumb.jpg.c578b2b71a6b7731c5627cc64b1bea14.jpg

 

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

jaffagold, Сейчас буду пробовать.. Спасибо))  Инспектором, нет пока не приходилось, в этом деле только учусь))

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

 неужели их нет с 319 по 374 строку?

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
8 hours ago, anzhelika0505 said:

Тут получилось, а как их добавить на сайт остальные пункты? 

 

/catalog/view/theme/zBaby/stylesheet/stylesheet.css

 

ищите ~ 377 строка

#menu .nav > li:nth-child(10) a{
	background-color: #0054A6;
}
#menu .nav > li:nth-child(10) > a:hover, #menu .nav > li.open > a{
	background-color: #003d79;
}

после него добавляете

#menu .nav > li:nth-child(11) a{
	background-color: #0054A6; //ЦВЕТ
}
#menu .nav > li:nth-child(11) > a:hover, #menu .nav > li.open > a{
	background-color: #003d79; // ЦВЕТ ПРИ НАВЕДЕНИИ КУРСОРА МЫШИ + КОГДА ОТКРЫТО ВЫПАДАЮЩЕЕ МЕНЮ
}

меняете в background-color: цвет.

Дальше по аналогии

:nth-child(12)

:nth-child(13)

:nth-child(и так дальше)

Изменено пользователем unknown

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
13 минут назад, unknown сказал:

 

/catalog/view/theme/zBaby/stylesheet/stylesheet.css

 

ищите ~ 377 строка


#menu .nav > li:nth-child(10) a{
	background-color: #0054A6;
}
#menu .nav > li:nth-child(10) > a:hover, #menu .nav > li.open > a{
	background-color: #003d79;
}

после него добавляете


#menu .nav > li:nth-child(11) a{
	background-color: #0054A6; //ЦВЕТ
}
#menu .nav > li:nth-child(11) > a:hover, #menu .nav > li.open > a{
	background-color: #003d79; // ЦВЕТ ПРИ НАВЕДЕНИИ КУРСОРА МЫШИ + КОГДА ОТКРЫТО ВЫПАДАЮЩЕЕ МЕНЮ
}

меняете в background-color: цвет.

Дальше по аналогии

:nth-child(12)

:nth-child(13)

:nth-child(и так дальше)

Ужс. А если будет 40 категорий?:)

 

Вот: http://joxi.ru/D2PeBoNHKEb0A3

Ссылка на руководство: http://htmlbook.ru/css/nth-child

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

n3bo, ответ дан с учетом того кода, который уже есть.

Это не мне отправляйте, а автору

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

anzhelika0505,

если по формуле, тогда

 

найти

Spoiler

#menu .nav > li:nth-child(2) a{
	background-color: #FAA61A;
}
#menu .nav > li:nth-child(2) > a:hover, #menu .nav > li.open > a{
	background-color: #e18e04;
}
#menu .nav > li:nth-child(3) a{
	background-color: #01AD4E;
}
#menu .nav > li:nth-child(3) > a:hover, #menu .nav > li.open > a{
	background-color: #01873e;
}
#menu .nav > li:nth-child(4) a{
	background-color: #EC008C;
}
#menu .nav > li:nth-child(4) > a:hover, #menu .nav > li.open > a{
	background-color: #bb0071;
}
#menu .nav > li:nth-child(5) a{
	background-color: #0054A6;
}
#menu .nav > li:nth-child(5) > a:hover, #menu .nav > li.open > a{
	background-color: #003d79;
}
#menu .nav > li:nth-child(6) a{
	background-color: #f9e000;
}
#menu .nav > li:nth-child(6) > a:hover, #menu .nav > li.open > a{
	background-color: #c2b901;
}
#menu .nav > li:nth-child(7) a{
	background-color: #FAA61A;
}
#menu .nav > li:nth-child(7) > a:hover, #menu .nav > li.open > a{
	background-color: #e18e04;
}
#menu .nav > li:nth-child(8) a{
	background-color: #01AD4E;
}
#menu .nav > li:nth-child(8) > a:hover, #menu .nav > li.open > a{
	background-color: #01873e;
}
#menu .nav > li:nth-child(9) a{
	background-color: #EC008C;
}
#menu .nav > li:nth-child(9) > a:hover, #menu .nav > li.open > a{
	background-color: #bb0071;
}
#menu .nav > li:nth-child(10) a{
	background-color: #0054A6;
}
#menu .nav > li:nth-child(10) > a:hover, #menu .nav > li.open > a{
	background-color: #003d79;
}

 

 

заменить на

Spoiler

#menu .nav > li:nth-child(5n+2) a{
	background-color: #FAA61A;
}
#menu .nav > li:nth-child(5n+2) > a:hover, #menu .nav > li.open > a{
	background-color: #e18e04;
}
#menu .nav > li:nth-child(5n+3) a{
	background-color: #01AD4E;
}
#menu .nav > li:nth-child(5n+3) > a:hover, #menu .nav > li.open > a{
	background-color: #01873e;
}
#menu .nav > li:nth-child(5n+4) a{
	background-color: #EC008C;
}
#menu .nav > li:nth-child(5n+4) > a:hover, #menu .nav > li.open > a{
	background-color: #bb0071;
}
#menu .nav > li:nth-child(5n+5) a{
	background-color: #0054A6;
}
#menu .nav > li:nth-child(5n+5) > a:hover, #menu .nav > li.open > a{
	background-color: #003d79;
}
#menu .nav > li:nth-child(5n+6) a{
	background-color: #f9e000;
}
#menu .nav > li:nth-child(5n+6) > a:hover, #menu .nav > li.open > a{
	background-color: #c2b901;
}

 

 

Получится вот так

7777.thumb.png.ab1379a27c0960ebfb394a77b4be4805.png

Изменено пользователем unknown

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

unknown, jaffagold, n3bo,   Спасибо большое!)) В этом деле новичок.   яЯимела в виду , что в инспекторе в браузере все получается,  а в файловом менеджере на бигете не вижу этих значений...

 

только эти 

}
#menu li.active li a {
    color: #C4C4C4;
    
}#menu li li.active > a:last-child {
    color: #FFFFFF;
}
#menu li li.active a:last-child:before {
    margin-left: 20px;
    margin-right: 10px;
    

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Для начала в самый конец файла stylesheet.css надо дописать новые стили.

Формулу вам расписали несколькими сообщениями выше.

Но сначала, пропишите хотя бы один.

После этого надо посмотреть на изменения, произошли или нет.

Для верности надо обновить модификаторы и обновлять страницу магазина так: Ctrl+F5

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

 

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

anzhelika0505,

 

скачайте файл

/catalog/view/theme/zBaby/stylesheet/stylesheet.css

 

Прикрепите сюда к сообщению

Изменено пользователем unknown

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Для публикации сообщений создайте учётную запись или авторизуйтесь

Вы должны быть пользователем, чтобы оставить комментарий

Создать учетную запись

Зарегистрируйте новую учётную запись в нашем сообществе. Это очень просто!

Регистрация нового пользователя

Войти

Уже есть аккаунт? Войти в систему.

Войти

  • Последние посетители   0 пользователей онлайн

    Ни одного зарегистрированного пользователя не просматривает данную страницу

×

Важная информация

На нашем сайте используются файлы cookie и происходит обработка некоторых персональных данных пользователей, чтобы улучшить пользовательский интерфейс. Чтобы узнать для чего и какие персональные данные мы обрабатываем перейдите по ссылке. Если Вы нажмете «Я даю согласие», это означает, что Вы понимаете и принимаете все условия, указанные в этом Уведомлении о Конфиденциальности.