olá + área de postagem em caixas


Hey baes ♥ Tudo bem? Eu vou bem... Como vocês já devem saber (ou n né) eu vou postar junto com a Ju alguns tutoriais. Meu nome é Bruna e estou no blogger desde dezembro de 2012! Eu faço layouts tem algum tempo e por conta disso tenho uma pequeníssima base em html :$ mas ela serve para alguma coisa, haha'
O tuto q vou apresentar é um básico, aprendi sozinha, estava cansada de pegar códigos por aí e montei do jeito q eu achava q era. Vou ensiná-los a separar a área da postagem em caixas e dps colocar sombra ou bordas.
Vamos lá;

Procure por .post-body {. Vc vai achar algo assim:
.post-body {
  line-height: 1.4;
  position: relative;
}

Substitua esse código por esse:
.post-outer {
margin: 4px 2px 10px;
background:#fff;
padding: 10px 10px;
margin-bottom: 15px;
}

E prontinho, sua área de postagem está dividida em caixas! Caso queira colocar sombra, basta acrescentar antes da } o seguinte código:
box-shadow: inset 0 0 15px #EAEAEA, 0 0 5px #ccc;

Se quiser usar bordas, faça o mesmo só que com esses códigos:
border: 1px solid #COR; (borda sólida)
border: 1px dashed #COR; (borda pontilhada)
border-top: 1px (solid ou dashed) #COR; (no topo)
border-bottom: 1px (solid ou dashed) #COR; (em baixo)
border-right: 1px (solid ou dashed) #COR; (na direita)
border-left: 1px (solid ou dashed) #COR; (na esquerda)

E é isso. Espero que tenham gostado! É um tuto bem simplesinho mas me deem um desconto, é o primeiro que faço :3
Até mais, mores ♥
Beijos de luz ;*

6 comentários:

  1. Seja bem vinda linda ^^ Este tuto é muito bom e útil para iniciantes >.< Beijocas amore ;)

    ResponderExcluir
  2. Seja bem vinda! Eu não conhecia o blog ainda e não posso esquecer de dizer o quão lindo este layout está <3

    Esse tutorial é muito útil!

    Abraço, Clara || n-found.blogspot.com

    ResponderExcluir
    Respostas
    1. clarinha, eu amo seu nome!
      obrigada ♥ jubs e eu agradecemos pelo elogio (apesar de eu só ter feito a página de afiliação hehe')
      sim sim!
      beijos ♥
      ps: amei o layout do teu blog, menina! ♥♥

      Excluir
  3. Ooi Bruna, eu vou bem, obrigada *u* Muito sucesso para você e para o blog ! Adorei o tutorial, eu já conhecia, mas o jeito que você explicou <3 Adorei, adorei, adorei :D

    ~kiss
    CS ♥

    ResponderExcluir
    Respostas
    1. eu estou besta com tanto carinho!
      Obrigada, muito obrigada msm!
      bjs ♥

      Excluir

Yoo chokito ^y^
Vejo que está indo comentar, fico feliz por isso, cada comentário pra mim é uma voz dizendo "Continue, não se desvie do seu sonho!" então muito obrigada... Mas, antes eu vou dizer algumas regrinhas, ok?

- Por favor, não fique no anônimo apenas para xingar alguém. E se não me engano, isso é o quê as blogueiras mais pedem. Eu ficarei muito agradecida se ninguém aqui praticar coisas do tipo, até porque estamos num pedacinho do céu, e temos que preservar a paz, certo? Certo!

- Se quiser pedir afiliação, é só ir na página que está no menu lá em cima. Querem uma asinha para subir? =3

- Desculpem, mas não faço parte do "Seguindo, segue de volta?", até porque aqui não é Twitter, né? E mesmo assim, eu visitarei todos os blogs, e seguirei se gostar do conteúdo. Não me importo com o layout, até porque estamos aqui para ajudar uns aos outros, né?

- Em breve estarei fazendo uma Ask para o blog, mas enquanto isso podem perguntar por aqui mesmo.

Bom... Eu acho que é só isso! Se quiserem algum tuto ou tag, podem pedir à vontade. Besitos, amo vocês! <3