Mudar cor de itens do menu

Olá a todos, estou com uma dúvida que acho que deve até ser simples, mas não estou conseguindo resolver. Eu quero que ao passar o mouse por cada item do menu principal cada item seja mostrado com um cor diferente como o do YooTheme: http://demo.yootheme.com/jan09/

Isso seria possível de alguma forma?

Olá li_shaoran!

Sem dúvidas.. é possível sim.

Vc deverá atribuir o comando :hover a div que pretende executar a ação.

Ex:. .botao a:hover {
background: #f00; (cor de fundo)
color: #fff; (cor da fonte)
}

Espero ter ajudado

Abs <!-- s:ugeek: --><img src="{SMILIES_PATH}/icon_e_ugeek.gif" alt=":ugeek:" title="Uber Geek" /><!-- s:ugeek: -->

Andre MaNcHa escreveu: Olá li_shaoran!

Sem dúvidas.. é possível sim.

Vc deverá atribuir o comando :hover a div que pretende executar a ação.

Ex:. .botao a:hover {
background: #f00; (cor de fundo)
color: #fff; (cor da fonte)
}

Espero ter ajudado

Abs <!-- s:ugeek: --><img src="{SMILIES_PATH}/icon_e_ugeek.gif" alt=":ugeek:" title="Uber Geek" /><!-- s:ugeek: -->

Entendi, mas ao aplicar o comando hover ele muda para a mesma cor todos os itens:

/* Top Main Menu */

#horiz-menu {background: #BBD52D url(../images/style1/horiz-menu-bar.jpg) 100% 0 no-repeat;}
#horiz-menu a, #horiz-menu .separator {color: #fff;}
#horiz-menu li a, #horiz-menu li .separator {background: url(../images/style1/horiz-menu-bg.png) 0 0 repeat-x;}
#horiz-menu li.active a, #horiz-menu li.active .separator, #horiz-menu li:hover a, #horiz-menu li:hover .separator, #horiz-menu li.sfHover a, #horiz-menu li.sfHover .separator {background: url(../images/style1/horiz-menu-bgactive.png) 0 0 repeat-x;}
#horiz-menu li.active a span, #horiz-menu li.active .separator span {background: url(../images/style1/horiz-menu-active.png) 50% 100% no-repeat;}

A linha #horiz-menu li:hover .separator usando {color: #999;} é a responsável no caso, ainda não consigo fazer com que cada item do menu mude para uma determinada cor <!-- s:x --><img src="{SMILIES_PATH}/icon_mad.gif" alt="" title="Furioso" /><!-- s:x -->

Ahhhh.... vc quer que cada item tenha uma cor diferente?? é isso??

Se for, terá que atribuir divs diferentes a cada um deles!

Seu trabalho está online?

Abs <!-- s:ugeek: --><img src="{SMILIES_PATH}/icon_e_ugeek.gif" alt=":ugeek:" title="Uber Geek" /><!-- s:ugeek: -->

Andre MaNcHa escreveu: Ahhhh.... vc quer que cada item tenha uma cor diferente?? é isso??

Se for, terá que atribuir divs diferentes a cada um deles!

Seu trabalho está online?

Abs <!-- s:ugeek: --><img src="{SMILIES_PATH}/icon_e_ugeek.gif" alt=":ugeek:" title="Uber Geek" /><!-- s:ugeek: -->

Isso, igual ao do demo do Way Beyond da YooTheme, item 1 azul, item 2 vermelho, etc.

Infelizmente ainda não está, estou querendo customizar esse template: http://demo.rockettheme.com/jan09/