Oi gente :3
Eu estou feliz porque estou me saindo bem em português, tirei 10 em quatro provas seguidas *u* só estou falando isso só porque não tenho o que falar, tenho apenas um pedido de ajuda q. Eu queria que vocês tirassem print do Blog pra eu ver como está o cabeçalho, porque estão falando que o Gadget do cabeçalho tá muito pra esquerda. Quem puder tirar, agradeço muito! Se quiser posso fazer algo em troca. o//
Hoje, como eu não via o que postar, fiz um tuto em 2 minutos ( sim, é muito fácil ) de como deixar as imagens em geral do Blog com borda Padding, e ao mesmo tempo hover. Preview aqui (rele na ilustração). Esse tutorial é muito simples e fácil, como eu já disse, mas só pra avisar, a bordinha ficará em todas as imagens do Blog. Vamos ver? ^_^
Vá em seu HTML, tecle Ctrl + F e procure por: ]]></b:skin>. Acima dessa tag, cole esse código:
Edite como quiser o que está em negrito.
border: 1px solid = Tamanho da borda colorida, solid é o tipo da borda, que seria a reta.
Tem vários tipos de borda, como dashed (traçadinha), dotted (pontilhada), etc.
................................................................................................................................................
Padding: Espaço dentro da borda/que fica 'dentro da bordinha colorida'.
Ele separa a borda solid da imagem.
................................................................................................................................................
box-shadow: 0 0 10px #EEE9E9; = Tamanho da sombra e cor.
10px = Tamanho. #EEE9E9 = Cor
................................................................................................................................................
Espero que tenham gostado :3
/* TUTORIAL FEITO PELO BLOG RESOURCES 4YOU, SE FOR PASSAR PARA ALGUÉM CREDITE POR FAVOR */
.main img {
padding:2px;
border:1px solid #FFBABA;
box-shadow: 0 0 10px #EEE9E9;
-webkit-transition-duration: .80s;
}
.main img:hover {
padding:2px;
border:1px solid #BFEFFF;
-webkit-transition-duration: .80s;
}
Entendendo:................................................................................................................................................
border: 1px solid = Tamanho da borda colorida, solid é o tipo da borda, que seria a reta.
Tem vários tipos de borda, como dashed (traçadinha), dotted (pontilhada), etc.
................................................................................................................................................
Padding: Espaço dentro da borda/que fica 'dentro da bordinha colorida'.
Ele separa a borda solid da imagem.
................................................................................................................................................
box-shadow: 0 0 10px #EEE9E9; = Tamanho da sombra e cor.
10px = Tamanho. #EEE9E9 = Cor
................................................................................................................................................
Espero que tenham gostado :3
Amei a borda o tuto ;)
ResponderExcluirPrint (http://2.bp.blogspot.com/-Z1kGj6XniYM/UmrtVjq7-EI/AAAAAAAABcA/RysT4YYBY58/s1600/R4Y.jpg)
Ficou um pouco escuro...
Kisses
lovely-monsters.blogspot.com.br
Obrigada *u*
ExcluirNossa, aí tá estranho também :c muito obrigada pelo print!
O print: http://i.imgur.com/zlqnEKZ.png aqui seu blog ta assim ^^
ResponderExcluir(uma macete pra saber como é seu blog em outros tamanhos de monitores: diminua e aumente o zoom do navegador).
Adorei o tuto da borda, simples e bonito ^^
Ox :c Obrigada pelo print *uu*
ExcluirVerdade né ><
Obrigada *uu*
aki o gadget no cabeçalho esta tudo normal........: )....amei o tuto acho q vou usar no meu proximo lay........ate breve!!!boa noit....
ResponderExcluirAi que bom *u*. Que bom que gostou e obrigada s2
ExcluirEu fiz o print, não cortei do lado esquerdo nem muito do direito.
ResponderExcluirhttp://4.bp.blogspot.com/-kdpZQXdPZAk/UmsIslAAjsI/AAAAAAAAAZA/LsoUXNsLT0s/s1600/Printkf.png
:)
O de todo mundo está assim, então vou dar zoom no navegador e ajustar. Vai ficar estranho aqui mas vai ficar bom pra vocês *u*
ExcluirObrigada pelo print !
Okay :)
ExcluirO cabeçalho ta normal, não tirei print porque muitos já tiraram então acho que seria desnecessário eu tirar, adorei o tutorial, kisses
ResponderExcluirCollected flowers ♡
Eu tive que tirar o gadget :/
ExcluirHehe, obrigada *u*
Amei o efeito, é muiito lindo. Esses dias eu estava querendo saber como é que deixava as imagens com esse efeito, agora já sei <3
ResponderExcluirhttp://maiira-t.blogspot.com.br/
Obrigada! Awn que bom que te ajudou, sério <3
Excluiroiiiiii helo,,,q dia vc vai fazer o tuto q eu t pedi......estou aguardando anciosamente pois preciso muito dele para começar a fazer meu layout novo!!!!!!!
ResponderExcluirFaço hoje ><
ExcluirNuss qe lay hein, ta liindo.
ResponderExcluirhttp://princesa-que-adora.blogspot.com.br/
Obrigada *3*
ExcluirAqui o gadget do cabeçalho ta normal .
ResponderExcluirAdorei o tutorial , super cute *w*
Kisses <3
x Senhorita Liberdade
Eu já tirei :c
ExcluirObrigada *uu*
Sobre o print, agora a imagem tá normal aqui, só que sem efeito, o3o Eu gosto deste tutorial, não precisa trabalhar tanto a imagem do post, já que a bordinha fica automaticamente, ^^
ResponderExcluirEu tive que tirar o gadget :/
ExcluirAsaush obrigada <3
Gostei do tutorial, Hello o Empire Mochi mudou de nome agora é : http://caramel-wae.blogspot.com.br/
ResponderExcluirAtualize sua elitee obrigado.
Obg! Ok ><
ExcluirPra mim seu cab tá ótimo :3 Amei o tuto, suuper útil!
ResponderExcluirSenhorita Frescurite (★)
Obrigada!! Eu tive que remover o cabeçalho. Obrigada flor *u*
ExcluirA imagem aqui está normal, depende do tamanho da tela do computador mesmo. Já conhecia essa borda, mais não gosto porque pena em todas as imagens do blog, inclusive nas paginações, beijocas.
ResponderExcluirEloísa do Having Cherry || Aguardo sua visita
Que bom >< É isso é verdade D:
ExcluirJá conhecia <33 acho super linda mas não uso kk'
ResponderExcluirEu não vou tirar o print pois não estou no pc' mas digo que o cabeçalho tá pela metade '-'
World Of Thel ♥
Ahsuashauh eu uso porém estou pensando em parar devido a paginação como a Eloísa disse. E outras coisas também.
ExcluirDiminuindo o zoom do navegador 2 vzs aqui fica também D: depende da tela. Obrigada pela informação!
Adorei.. Não vou tirar print porque está normal aqui uhashsa
ResponderExcluirrockncherry.blogspot.com
Obrigada *u* Tudo bem uahsahs
ExcluirAgora eu entendi o que é borda padding u-u eu não sabia o que era u-u -p
ResponderExcluiramei o tutorial, novo aqui o//
breaking-r.blogspot.com.br
Asaushaushaussah. Obrigada, e seja bem-vindo *u* kk
ExcluirAmeeeei o tuto, fica super lindo ! No proximo lay eu coloco !
ResponderExcluirJá estou seguindo aqui, seu blog é muito divo e.e
Kisses for you || TTH
Obrigadaa! Awnn *-*
ExcluirMuito obrigada
Aqui tá normal haushuahsua deve ser o seu navegador ç3ç experimentar diminuir e aumentar o zoom >3<
ResponderExcluirAdorei a borda, uso muito e fica lindo <3
Kiss
With You
Ahsuahs eu tive que excluir o gadget triste vida..
ExcluirObrigada *u*
Aqui tá tudo normal, -q
ResponderExcluirMuito legal o tuto, Talvez eu use, -u-
Eu tirei o gadget D: pelo menos o cabeçalho está normal.
ExcluirObrigada! *uu*