Portas corrediças com CSS

[k2yjr63 0]

Olá,

 

Segui um tutorial em que o Menu aparece em abas, onde a aba current assume um gif diferente. Gostaria de saber como trocar a Aba quando colocamos o mouse em cima ou clicamos na aba?

 

Obrigado,

 

Elson

[Diéssica 140]

quando colocamos o mouse em cima

:hover no seletor do elemento

 

Exemplo:

<a href="#" id="imasters">Passe o mouse</div>

#imasters {
background:#000;
}

#imasters:hover {
background:#ccc; /* ao passar o mouse em cima do elemento, ele ficará cinza */
}

quando clicamos na aba

:active no seletor do elemento

 

Exemplo:

<a href="#" id="imasters">Clique aqui</a>

#imasters {
background:#000;
}

#imasters:active {
background:#ccc; /* ao clicar no elemento, ele ficará cinza */
}

 

:seta: http://tableless.com.br/pseudo-classes-css/

[k2yjr63 0]

<div id="menu">
   <ul> 
<li ><a href="<?php echo $home ?>"> Home </a> </li>
<li ><a href="<?php echo $home.'?p=servicos' ?> "> Serviços </a> </li>
<li id="current"><a href="<?php echo $home.'?p=portifolio' ?> "> Portifólio </a> </li>
<li ><a href="<?php echo $home.'?p=contato' ?> "> Contato </a> </li>
   </ul>
</div><!-- menu -->
<div id="corpo">

 

a ideia é ao clicar mudar o id do li, assim com esta abaixo

 

<div id="menu">
   <ul> 
<li id="current"><a href="<?php echo $home ?>"> Home </a> </li>
<li ><a href="<?php echo $home.'?p=servicos' ?> "> Serviços </a> </li>
<li ><a href="<?php echo $home.'?p=portifolio' ?> "> Portifólio </a> </li>
<li ><a href="<?php echo $home.'?p=contato' ?> "> Contato </a> </li>
   </ul>
</div><!-- menu -->
<div id="corpo">

[Diéssica 140]

Vê esse post meu:

:seta: http://forum.imasters.com.br/topic/463355-menu-faltando-algo-em-css/page__view__findpost__p__1836292