22 de fev. de 2013

Menu - Pink Baby


Olá meus ursinhos! Boa noite! Vim trazer um tutorial de um menu super fofo! Peguei aqui,portanto créditos pra lá... Vamos lá? Então Let's Go!


Primeiro vai no editor HTML do seu blog, aperte F3 e pesquise por:

]]></b:skin>
Agora acima do código destacado em laranja cole o seguinte código:

/* Menu Pink Baby by Candy-Grape */pinkbaby{color: #FFE4C4; /* cor da fonte quando passa o mouse */text-align:center;font-size: 10px; /* Tamanho da fonte do menu */background: #F08080 ; /* Fundo do menu */padding: 2px;float: left;margin: 2px;width: 40%; /* tamanho do menu */-webkit-transition-duration: .80s;border: 1px solid #FF3030; /* bordas */}pinkbaby:hover{background:#FF3030; /* fundo do menu quando passa o mouse */border: 1px solid #FF3030; /* bordas quando passa o mouse */color: #FFEFDB; /* cor da fonte quando passa o mouse */-webkit-transition-duration: .80s;border-radius: 10px; /*---- bordas arredondadas ----*/}
Agora edite as cores que está sublinhas usando essa tabela aqui.

Agora adicione um Gadget HTML/JavaScript com esse código e edite o que necessário:

<div><a href="URL 1"><pinkbaby>NOME 1</pinkbaby></a><a href=" URL 2 "><pinkbaby>NOME 2</pinkbaby></a><a href=" URL 3 "><pinkbaby>NOME 3</pinkbaby></a><a href=" URL 4"><pinkbaby>NOME 4</pinkbaby></a></div>
Beijos.

3 comentários:

  1. eu amo o seuu blog amor os tutoriais sao bem explicados e ja usei bastante mais eu queria aprender uma coisa como faz esse efeito nas imagens http://4.bp.blogspot.com/-zGC_PTocjI0/USaZGKl_p9I/AAAAAAAABz8/GJkHvicuras/s1600/it+(1.png

    Bjjuuss

    ResponderExcluir
  2. Esse efeito se faz com um programa no computador fofa! Vou pesquisar, posta aqui e te aviso ok!
    Bjs
    LuLy.

    ResponderExcluir

- Não faço parcerias, apenas afiliações. (Mas no momento sem vagas).
-"Seguindo,segue de volta?" Seguirei os blogs que eu realmente gostar.
- Não aceito selinhos (Só de afiliados).
- Deixe o link do seu blog para eu visitá-lo