Menu Ghosts

Isso não é bem um menu, é mais um efeito feito com sombras que deixa o menu mais legal, rs. 

Vizualize o efeito aqui.

Como você pôde ver, são 5 efeitos. Então, vamos começar:

Os códigos abaixo deverão ser colocado no seu css, mas cada um é um efeito visto no exemplo. Então escolha um e cole-o no seu css:

Lembrando que você pode modificar todos os números dos pixels de acordo com o tamanho da fonte. E, se você quiser utilizar a fonte “Bandless” (mesma fonte utilizada no exemplo), coloque esse código no seu css:

@font-face {font-family: "Bandless"; src: url('http://static.tumblr.com/o286adx/hgQm6rhus/bandless.ttf'); format("truetype"); }

E coloque onde você quiser o menu (só pegue a parte que esteja com o mesmo nome da class do seu efeito): 

 <div class="ghosts">Conteúdo</div>
<div class="ghosts2">Conteúdo</div>
<div class="ghosts3">Conteúdo</div>
<div class="ghosts4">Conteúdo</div>
<div class="ghosts5">Conteúdo</div>

E o seu efeito Ghosts estará pronto, rs. 

  • Credite ao making-themes, se utilizar; 
  • Se for útil, dê like no post;
  • Códigos por Giovanna C.
  1. making-themes posted this