18 de setembro de 2012

Tutorial - Blockquote igual do blog!

Tumblr_m940l2wcdu1qei95oo1_500_large

OOOii gente linda do meu coração <3 Tudo bem ? É, passei um tempo sem postar de novo,desculpa, tava sem assunto D: Ai, lembrei de uma promessa que tinha feito a vocês, de ensinar o blockquote.
Eu peguei alguns códigos e modifiquei, então se usar credite o SAB
 O blockquote você pode visualizar nesse blog 
Viram que efeito legal ? *o* Eu me apaixonei por ele u3u
Aqui está o código dele :

.post blockquote {
background: #efefef; /*Altere o fundo como preferir*/
border-right: 12px solid #ff6b7e; /*Altere a cor da borda como preferir*/
border-left: 12px solid #ff6b7e; /* cor da borda quando passa o mouse */
-webkit-transition-duration: .60s; /* Duração do Efeito - não modifique se quiser o efeito igual ao meu */
padding: 5px;
}
blockquote:hover {
border-right: 7px solid #ff6b7e; /*Altere a cor da borda como preferir*/
border-left: 7px solid #ff6b7e; /* cor da borda quando passa o mouse */
-webkit-transition-duration: .60s; /* Duração do Efeito - não modifique se quiser o efeito igual ao meu */
background: #efefef; /* cor do fundo quando passa o mouse */
}

Vá em Desing >> Editar HTML >> Procure por ]]></b:skin> e cole o código do blockquote acima dessa tag.
Para usar o blockquote, é só escrever seu post, e onde quiser que o blockquote apareça, clique aqui:

Bom, o código diz tudo né ? O que está em verde é o fundo, e em rosa a cor das bordas.
Se usar, credite ao SAB.Proibido reblogar sem permissão.


5 comentários:

  1. Ta.. mas onde coloco isso? no html do post ou no html do blog? onde coloco? onde escrevo oq quero que apareca dentro da caixinha?? -.-'

    ResponderExcluir
  2. *O* que legal o tuto! Além de ser super útil para as blogueiras também deixa o blog super fofinho *u* adorei seu cantinho! alem de ter um layout divo, o conteúdo tbm é ótimo, estou seguindo aqui :D Quando sobrar um tempinho livre, passa lá no meu blog? E se gostar seguir? Vai ser uma honra te receber lá no meu blog :D Bjs Ana Karoline.

    http://morangosdespedacados.blogspot.com.br/

    ResponderExcluir
  3. Que blog lindoooooooooooo! Que saudadeees! Voltei a postar no blog (Estava de Férias) e agora estou te esperando lá! Obs. Sei que já disso isso, mais seu blog esta muuuuuuuito lindo!!!! Parabens :)nosmeninasgostamos.blogspot.com

    ResponderExcluir

- Não estamos mais aceitando selinhos e tags.
- Não insista : se comentar "seguindo, segue de volta?", eu vou ignorar
- Sua opinião é importante para a equipe (: Dúvidas, sugestões ou reclamações?Comente!Críticas (construtivas) também são aceitas.