Menu s com CSS

CSS - Style Sheet

Professor: Jolvani

Aula 32
Menu s com CSS
Anteriormente construmos esse menu com o uso da biblioteca jQuery
para trazer o efeito de abrir e esconder o elementos do menu dentro de
nossa lista.

Nesta aula iremos usar o mesmo efeito usando

Somente recursos CSS.
Menu s com CSS
Como no usaremos jQuery a primeira coisa a fazer remover as
referncias javascripts dos efeitos nos menus:
Salvamos a aula menu22e23menuVertical.html para
aula32_menucomCSS.html, e removemos as referncias ...
Vc ir notar que todos os submenus
sero apresentados a partir desse
momento.
Menu s com CSS
Como podemos esconder os submenus? Dentro do CSS que estiliza o submenu
devemos utilizar a propriedade display com o valor none.
Essa propriedade ir esconder todos os submenus... (teste)

Agora precisamos apresentar o submenu...

Devemos usar o evento hover para que quando
passarmos o mouse por cima do menu seja
apresentado o submenu. Alterando o elemento
Interno da li. Ficando assim:

li:hover > ul{

}
Menu s com CSS
Devemos usar o evento hover para que quando
passarmos o mouse por cima do menu seja
apresentado o submenu. Alterando o elemento
Interno da li. Ficando assim:

li:hover > ul{

}
Apresentando para o usurio
display:block;
Prxima Aula: CSS Sprite