• - ChapStique -

    - ChapStique -

  • - Crouton -

    - Crouton -

  • - Nadaddy -

    - Nadaddy -

  • - Fatty -

    - Fatty -

  • - Hollywood -

    - Hollywood -

29 de outubro de 2013

Menu de Pages - Tutorial

Olá gente, espero que estejam bem. 
Estou de novo aqui, apenas por um motivo: tédio. E até porque estou super passando mal, nem sei como fui à escola hoje, devido às olimpíadas, saí cedo graças à meu bom Deus @--@ Estou cheia de dor de cabeça e ainda resfriada, o pior é a tontura, você anda e parece se seu cérebro tá pulando :c 

Achei super legal o fato de vocês terem gostado do layout free de halloween, mesmo ele não tendo nadica de nada de halloween -.- e vi que pediram pelos comentários, um tutorial de como fazer aquele menu do topo, confesso que pensei em usar no próximo layout do A.N, mas por esses dias estou sem inspiração para terminar o layout, aí comecei a fazer outro modelo de layout para o próximo do A.N, não me decido. Então, hoje trouxe como fazer esse menu do topo: Prévia ~x

Cole acima de ]]></b:skin>:

.menudepages {
text-align: center;
position: fixed;
z-index: 1000000;
width: 100%;
top: 0; left: 0;
background: #c2bdc7;
height: 25px;
padding: 5px;
word-spacing: 10px;
}
.menudepages a{
color: #ccc8d0;
text-shadow: 1px 1px 0 #afa8b5;
font-family: "simple";
font-size: 20px;
-webkit-transition-duration: 1s;
}
.menudepages a:hover {
color: #d6d3d9;
text-shadow: 1px 1px 0 #a59eac;
}
@font-face {
font-family: "Simple";
src: url("http://static.tumblr.com/jxlyjkb/3LBmpn15n/bebasneue.otf");
font-weight: normal;
font-style: normal;
}

Agora, cole em um HTML // Javascript:

<div class="menudepages">
<a href="LINK-AQUI">NOME</a>
<a href="LINK-AQUI">NOME</a>
<a href="LINK-AQUI">NOME</a>
<a href="LINK-AQUI">NOME</a>
<a href="LINK-AQUI">NOME</a>
<a href="LINK-AQUI">NOME</a>
<a href="LINK-AQUI">NOME</a>
<a href="LINK-AQUI">NOME</a>
</div>

12 comentários:

  1. É Bem lindo o resultado *-* Vou salvar em favoritos.

    World Of Thel ~

    ResponderExcluir
  2. Muito lindo o menu, o efeito é muito bacana também. Deixei até salvo nos favoritos para quando eu precisar.
    Melhoras, a dor e tonteira vai passar :)
    Post novo no Prince Teen, venha ver e se gostar comente :)
    Obrigado pela visita ao PT. Volte sempre!
    Abraços ~> http://www.princeteen.com/

    ResponderExcluir
  3. Esse tutorial é perfeito <3 vou até colocar lá no blog depois, salvei nos favoritos <3 Lá na escola também tem Olimpíadas, eu nunca participo , porque sempre acontece algo que faça com que eu não vá <|3 Inclusive to seguindo seu blog <3 não em retribuição por você ter me seguido [a megan me seguiu <3] mas, porque eu queria seguir faz tempo mas a minha cara de pau de ser preguiçosa não deixava ;_;

    xoxo,

    http://paradise-moon.blogspot.com.br/

    ResponderExcluir
  4. é bem fofo...........espero q vc fique boa logo.........

    Bjkas e boa tarde!!!!!!!!(SG )) ♥♥

    http://louca-por-html.blogspot.com.br/

    ResponderExcluir
  5. e.e eu já sabia desse, fica lindo né ? u.u, também tô meia.. pau para inspiração ! Ruim né ?
    miss-teensami.blogspot.com

    ResponderExcluir
  6. AAH que merda isso né :/// tontura é terrível, ma sorte sua que vc não sofre de enxaqueca tipo eu :(
    AAAAAAAAAAH MDS *-* O MENU QUE EU PEDI :3 MEGAN é OUTRO NIVEL de perfeição o//

    XOXO :D
    Joven Clube | Offcial

    ResponderExcluir
  7. Não sei nem como tu conseguiu ir pra escola com dor de cabeça, eu nem levanto da cama! @.@
    Valeu por ter ensinado o menu, obrigado mesmo! ~favoritei~
    Bjo, Sel ;*

    Jovens Gordinhas

    ResponderExcluir
  8. q lindo vou usar no meu proximo layout!
    Monster Stay

    ResponderExcluir
  9. Tuto muito bom, funcionou direitinho no meu blog *O*

    ResponderExcluir
  10. Usei no meu Blog e ficou perfeito.
    Muito Obrigado!

    Deixarei créditos!

    Dudynha Oliveira

    ResponderExcluir