<div style="position: absolute; margin-top: -760px; left: -90px;">

<div id="ziip">                      
 <a href="/">Home</a>
 <a href="/">Ask</a>
 <a href="/">Tutoriais</a>
 <a href="/">Materiais</a>
 <a href="/">Pedidos</a>
 <a href="/">Créditos</a>

</div></div>

Legendas nas Imagens (Tutorial)

MDT #5: LEGENDA NAS IMAGENS DO BLOG

"Não importam seus defeitos, todos tem um também." - Ariana Grande.

 http://blog-part-of-me.blogspot.com.br/2013/06/mdt-5-legenda-nas-imagens-do-blog.html
Olá queridos leitores! Bom, essa é a última postagem da Maratona de Tutoriais do Blog. Deixei esse tutorial por último já que é totalmente exclusivo e criado por mim. Amanhã eu já irei postar o tão esperado Layout Free, ele já está pronto há algum tempo, mas queria deixá-lo para esse fim de semana, para fecharmos essa semana de férias com chave de ouro, concordam?

Bom, o tutorial é super fácil, você só precisa de um pouco de atenção para poder aplicá-lo em seu blog. Vamos lá?

No Painel do Blog - Clique no nome do seu Blog - Modelo - Editar HTML e pesquise por: ]]></b:skin>Quando achar, cole o código abaixo antes desse, fazendo as devidas alterações: 
.imagem  {
margin-top:0px; /* margem do topo */
}
.imagem img  {
align:center; /* alinhamento */
margin-top:0px; /*margem do topo */
}
.imagem .legenda  {
-webkit-transition: all 1.0s ease-out;
-moz-transition: all 2.5s ease-out;
width:500px; /* largura da área da legenda */
height:20px; /* altura da área da legenda, não precisa mexer */
margin-top:-23px; /* margem do topo, mexa se precisar */
margin-left: 13px; /* margem da esquerda, mexa se precisar */
color:#COR; /* cor da letra */
background: #COR; /* cor do fundo */
opacity: 0.60; /* não mexa */
text-align: center;
}
.imagem:hover .legenda  {
background: #COR; /* cor do fundo hover */
opacity: 0.99; /* não mexa */
-webkit-transition: all 1.0s ease-out;
-moz-transition: all 2.5s ease-out;
}
Depois de aplicar o código de personalização da legenda, você precisa aplicá-lo nas imagens do Blog, para isso, na área onde escrevemos o conteúdo das postagens, mude para a aba HTML (lado superior esquerdo), e cole o código abaixo, fazendo as devidas Alterações:
<div class="imagem">
<div style="text-align: center;">
<img src="URLDAIMAGEM" /></div>
<div class="legenda">FRASE</div></div>
Caso o código dê erro, acrescente outra </div> no final dele, certo? Se usá-lo uma vez terá que aplicá-lo em todos os Layouts do Blog, mesmo que não vá aplica-lo mas em futuras imagens, para que não dê erro nas que você já tinha aplicado, entende?
Espero que tenham gostado, repito: Esse tutorial é EXCLUSIVO, foi criado por mim, então por favor, se usarem deem os créditos, ok? Bom, por hoje é só mesmo, aguardem o Layout Free amanhã! Até mais õ/

Menu Up & Down

Menu Up & Down

Status: Gayband do The Wanted brincando com meus sentimentos, até quando? #WeOwnTheNight
Sem ideias pra introdução nesses dias, aí sai essas coisas...
Oi gente!
Estou numa séria fase de abstinência de Revenge e The Vampire Diaries, não aguento mais viver sem! Estou com saudades de como o Stefan se ferrava no fim dos episódios e, em Revenge, até do idiota do Jack, que já tava irritando... Agora só tenho Teen Wolf ¬.¬

Mudando de assunto, esses dias eu estava teimando em fazer um menu (apresentável) pra vocês já que na minha tags menu não tem nem 10 posts e nos efeitos tem milhares. Eu gostei do resultado (O.O milagre de Deus!) Aqui uma preview: ••••

••• ♥ •••
Use com tooltip, é mais legal! ^-^

1 • No HTML do seu blog, aperte F3 e procura pela tag ]]></b:skin> • Quando achar, cole o seguinte código acima:
.fade-isa {
font-family: trebuchet ms;
font-size: 11px;
padding: 5px;
background-color: #COR DO FUNDO (ROSA);
box-shadow: inset 0 0 20px #COR DA SOMBRA INTERNA (ROSA), 0 0 4px #ccc;
text-align: center;
width: TAMANHO DO MENUpx;
text-transform: uppercase;
word-spacing: 5px;
letter-spacing: 1px;
-webkit-transition-duration: .80s;}
.fade-isa a {
color: #COR DA FONTE;
text-align: center;
padding-top: 20px;
padding-bottom: 20px;
padding-left: 5px;
padding-right: 6px;
text-shadow: 2px 1px 1px #COR DA SOMBRA DO TEXTO;
-webkit-transition-duration: .80s;}
.fade-isa a:hover {
color: #COR DA FONTE AO PASSAR O MOUSE;
text-shadow: 2px 1px 1px #COR DA SOMBRA AO PASSAR MOUSE;
text-align: center;
padding-top: 5px;
padding-bottom:5px;
padding-left: 5px;
padding-right: 6px;
background-color: #COR DO QUADRADINHO (AZUL);
box-shadow: inset 0 0 20px #COR DA SOMBRA DO QUADRADINHO (AZUL), 0 0 4px #ccc;
-webkit-transition-duration: .80s;}
É grande, eu sei mas tudo o que é preciso é prestar atenção no que se pede e substituir o que está em MAIÚSCULO.

Aí é só visualizar - para ver se nada desconfigurou - e depois salvar.

•••••••••• ♥ ••••••••••

2 • Vá em Layout ♣ Adicionar Gadgets ♣ HTML/JavaScript e cole:
<div class="fade-isa">
<a href="LINK" title="Alguma coisa aqui">Nome</a>
<a href="LINK" title="Alguma coisa aqui">Nome</a>
<a href="LINK" title="Alguma coisa aqui">Nome</a>
<a href="LINK" title="Alguma coisa aqui">Nome</a>
<a href="LINK" title="Alguma coisa aqui">Nome</a>
<a href="LINK" title="Alguma coisa aqui">Nome</a>
<a href="LINK" title="Alguma coisa aqui">Nome</a></div>
Em Alguma Coisa Aqui escreva o que você quer que apareça no tooltip (uma mensagem que aparece em um balãozinho, como podem ver ao passar o mouse nas imagens dos afiliados) Caso não queira o tooltip, apague: title="Alguma coisa aqui"

•••••••••• ♥ ••••••••••

Download YuruYuri Legendado


Gênero: Comédia
Ano: 2011
Episódios:12
Fansub: Animakai, Moonlight_Flowers
¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨
Sinopse:YuruYuri (Yuri tranquilo), ou YRYR (conforme a escrita na capa), é um anime de comédia de estudantes sobre uma turma de garotas aprontando o que quiserem no clubinho como no Seitokai no Ichizon,onde mostra elas vivendo momentos divertidos com suas atividades.


Another


Sinopse
26 anos atrás, em uma classe de terceiro colegial, uma estudante chamada Misaki era a mais popular e adorada do colégio por causa de sua beleza e sua qualidade nos esportes. Porém um dia Misaki acaba por vir falecer e como homenagem seus amigos decidem “fingir” que ela está viva com eles até o dia da formatura. Anos depois,em uma primaverda de 1998, um garoto chamado Sakakibara Kouichi se muda para a cidade e começa a estudar na mesma escola do ocorrido

Postagens populares