Em primeiro lugar visualize o menu: aqui

1- Cole os códigos abaixo em seu CSS:

.menuilh {margin-bottom : 1px;font-family: "Script MT Bold"; font-size:16px; letter-spacing : 1px; line-height: auto;text-shadow: 0px 1px 1px #291b2a;background:#291b2a;color:#fff; width:50px;-moz-transition: all 3s ease; -o-transition: all 3s ease; transition: all 3s ease;border-radius:7px;padding:6px;display: inline-block;}

.menuilh:hover {-webkit-transform: scale(1.5) ; -moz-transform: scale(1.5) ; -o-transform: scale(1.5) ; -moz-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease;transform: scale(1.5);color:#fff;background:#4d424d;-moz-transition: all 3s ease; -o-transition: all 3s ease; transition: all 3s ease;border-radius:7px;padding:6px;}

@font-face {font-family: "Script MT Bold";
src: url("http://static.tumblr.com/mw3v5cd/FYymaipvr/scriptbl.ttf"); /* para IE */
src: local("Script MT Bold"), url("http://static.tumblr.com/mw3v5cd/FYymaipvr/scriptbl.ttf") format("opentype");
}

2- Modifique cores tamanhos e o que mais quiser (background, color, width, font-size...)

3- Coloque o código abaixo onde quiser que o menu apareça:
 - se for de links:

<a href="/" class="menuilh">Menu</a>

<a href="/" class="menuilh">Menu</a>

<a href="/" class="menuilh">Menu</a>

<a href="/" class="menuilh">Menu</a>

 - se for iframe:

<span onClick="changeNavigation('01')" class="menuilh" >Menu</span>

<span onClick="changeNavigation('02')" class="menuilh" >Menu</span>

<span onClick="changeNavigation('03')" class="menuilh" >Menu</span>

<span onClick="changeNavigation('04')" class="menuilh" >Menu</span>

Salve e veja como ficou !


Olá pessoal, vou ensinar como usar o font face ok ? Lembrando que eu aprendi a usar graças ao site do maujor.com então créditos a esse site ok ? Bom vamos la.

1- Você deve baixar a fonte de pixel que você quiser, eu uso a wendy.
  - Site para baixar a fonte: http://www.dafont.com/wendy.font

2- Depois que baixar, dezipe a pasta e cole a fonte na área de trabalho.

3- Vá em http://www.tumblr.com/themes/upload_static_file e faça upload da sua fonte.

4- Vá para seu HTML e coloque isso antes de </style>

@font-face {font-family: "Nome da sua fonte";
src: url("URL"); /* para IE */
src: local("Nome da sua fonte"), url("URL") format("opentype");
}

5-Agora modifique tudo em negrito ali em cima.
 - O meu ficou assim:

@font-face {font-family: "wendy";
src: url("http://static.tumblr.com/mw3v5cd/jxRmaip37/wendy.ttf"); /* para IE */
src: local("wendy"), url("http://static.tumblr.com/mw3v5cd/jxRmaip37/wendy.ttf") format("opentype");
}

6- Depois de ter arrumado se código. Quando for usar a sua fonte coloque isso:

font-family: "Nome da sua fonte"; 

- O meu ficou assim:

font-family: "wendy";

Está pronto. Qualquer dúvida perguntem :D




Feitas por Dangrima, com o tempo vou postando mais. Se usar credite!

Marcadores: cortininhas