24 janeiro 2014

Tutorial: Como ajustar o tamanho da imagem na area do post.

Olá!
Faz tanto tempo que não posto tutoriais, que até perdi a prática, sério! Mas, hoje trago um tutorial que acho realmente útil, e bem fácil. Sabe quando você quer colocar uma imagem que ocupe o tamanho todo da área do post, mas, quando você usa o tamanho "Muito Grande" do blogger, a imagem ultrapassa o limite? Isso é realmente muito chato, por isto, uso um tutorial com um código adaptado por mim, para que a imagem tenha uma largura máxima, e se ajuste no tamanho da área do post.

No HTML, procure por:

/* Posts

Agora, cole abaixo o seguinte código:

.post img {
border: 0;
margin: 0 -30px 0 -30px;
padding: 0;
max-width: 540px; *tamanho máximo da imagem, altere-o de acordo com a área de seu post**
}

Salve.
Resultado:

Esse tutorial foi inspirado no do Blog da Nah, o qual ensina a manter TODAS as imagens de um tamanho só (inclusive icones. mini-gis, e etc).
A imagem de teste foi tirada por mim.

14 comentários:

  1. O.O Eu não sabia que dava pra fazer isso.
    MEDB = salvação do meu blog
    kkkk AMEI esse tutorial, com certeza usarei no próximo lay!

    ResponderExcluir
    Respostas
    1. eu fui descobrir a pouco tempo, também. Awwn, fico feliz por ter ajudado.

      beijão!

      Excluir
  2. Não sabia que isso era possível! Muitos blogueiros usam alguma ilustração larguinha em um layout e depois que mudam, a imagem fica desproporcional! Simplesmente amei o tutorial! <3

    Um grande beijo,

    Juu-Chan || Nescau com Nutella

    ResponderExcluir
    Respostas
    1. Acontecia o mesmo comigo, por isso recorri a este tutorial hahaha Obrigada, fico feliz por ter ajudado <33

      beijão!

      Excluir
  3. Eu não encontrei isso no emu HTML.
    daisedaiane.blogspot.com.br

    ResponderExcluir
    Respostas
    1. Esse novo HTML está completamente horrível, acho que se vocês apertar naquelas "setinhas", o HTML todo se revela. Ah, verifique se você não copiou com uma area de espaçamento...

      beijão!

      Excluir
  4. bem legal o tutorial!!!
    Passando para desejar um ótimo dia!
    Liz<3
    The Red Lil' Shoes Blog
    http://www.theredlilshoes.com.br/

    ResponderExcluir
    Respostas
    1. Obrigada, o mesmo a você, Liz <3

      beijão!

      Excluir
  5. Adorei o tuto, vou usar depois :3 E este layout é perfeito.

    Visite o blog | Etc For Me ♥

    ResponderExcluir
    Respostas
    1. Fico feliz por seu útil. Obrigada :3

      beijão!

      Excluir
  6. MDS , eu não sabia deste tutorial ! Simplesmente amei ! ♥
    Já vi em vários blogs as ilustrações desproporcionadas e fiquei sem jeito de falar , mais adorei :3
    Seguindo aqui , retribui ?

    Um beijo meu , Miih . <3
    Visita ? | Colorful Rainbow

    ResponderExcluir
    Respostas
    1. Ah, fico feliz <3 È verdade, bastante blogs tem ilustrações bem desproporcionais :3
      Sigo sim ><

      beijão!

      Excluir
  7. Respostas
    1. Vou te colocar na lista agora mesmo! :D

      beijão!

      Excluir

.Não gostou do blog? Cada um tem o direito de gostar ou não gostar, claro, mas expresse isso de modo civilizado, sem palavrão e ofensas.
.Não tenho nada contra o famoso ''seguindo, segue de volta?'' desde que você comente pelo menos algo sobre o post.
.Eu sempre comento de volta, e se gostar do blog, sigo.
.Viu alguma coisa sua aqui? Me contate e discutiremos o assunto.
Obrigada pelo comentário!