10 de jan. de 2013

Efeito Round

Olá pessoas! Como vão?
Estou começando a me interessar por desenhos vetoriais, na minha opinião, os layout's mais lindos são aqueles que tem uns desenhos bem grandões, acho que deixa o blog diferente, já que não é tão usado.
Enfim, fui pesquisar pra ver se achava um programa pra desenhar, encontrei vários. O Inkscape foi o melhor que achei, fiquei o dia todo desenhando finalmente achei um programa que me viciou mais que o Photoshop, além de ser super fácil de usar, ele é grátis. Vou formatar o computador e baixar o CorelDraw.
Trouxe um efeito muito lindo, lá do Kawaii World, o nome dele é Round avá, fica lindo em destaques e em elites de afiliados. Espero que gostem!
Veja um preview do efeito clicando aqui.


1. Vá em editar HTML e procure por ]]></b:skin>. Acima da tag cole o seguinte código:
.efeitoround  {
background: #CORDOFUNDO;
border: 5px solid #CORDABORDA;
display: inline-block;
font: 20px 'Chela One', cursive;
width: 50px;
height: 40px;
color: #CORDAFONTE;
padding-top: 10px;
margin: 5px;
-webkit-border-radius: 50px;
-webkit-transition: 1s linear;
}
.efeitoround:hover {
background: #e7a6c0;
-webkit-box-shadow: inset 0px 60px 10px #CORDOFUNDOHOVER;
border-radius: 0px;
color: #ffffff;
text-decoration: none;
-webkit-border-radius: 50px;
-webkit-transition: 1s linear;
}
Altere o que está em negrito.

Depois em um gadget HTML/Javascript cole:
<a href="LINK" class="efeitoround" title="NOME INTEIRO DO BLOG">SIGLA DO BLOG</a>

Se quiser que fique com a mesma fonte, cole o seguinte código abaixo de <head>:
<link href='http://fonts.googleapis.com/css?family=Chela+One' rel='stylesheet' type='text/css'/>
Meus querides! Caso vocês gostem desse blog e queiram continuar me acompanhando, eu ainda escrevo, mas em outro blog. Não posto apenas tutoriais, mas continuo escrevendo e falando de vários assuntos, inclusive a blogosfera. Caso queira visitar (sério ótimo uma visita): clique aqui para ir ao blog Serenar

3 comentários:

  1. Eu tinha o coreldraw, mas não aprendi a usar. Pra falar verdade nem tentei, morria de preguiça na epoca hahah

    eu gosto desse efeito, pretendo usar um dia.

    Lucy, quer que te coloque como adm do blog de tutoriais? assim você poe o preview se quiser ^^

    ResponderExcluir
    Respostas
    1. Eu quero baixar, mas to com preguiça...
      O efeito é lindo!
      Por mim, tudo bem.

      Excluir

Seja educado, não use palavras ofensivas ou de baixo calão;
Comente algo relacionado ao post, para outros assuntos use a ask;
Obrigada e volte sempre!