Criando menus verticais

Aprenda a criar simples porém bonitos menus verticais utilizando html e principalmente css.

Por | @oficinadanet Programação
Olá,

Esse tutorial foi beseado no scprit desenvolvido pelo ~Patybs, apenas criei um tutorial e modifiquei o código conforme minha preferência.

CRIANDO O HTML:
Bom primeiramente coloque a estrutura básica do html que é essa aqui:



Menu vertical






Certo agora vamos colocar os itens do menu, serão apenas links a parte importante e mais complexa fica por conta do css, o código dos menus é esse aqui:



Menu vertical



Oficina da net
Tutoriais clube
Capixabinha




A parte do html está pronta vamos agora programar o css.

A PARTE DO CSS:
Vou por o css dentro do próprio html, caso queiram criar um documento externo fiquem avontade. O código de formatação do css é esse:



Coloque os scprits do css dentro das tags