Sobre o Blog

MamanunesO Dicas e Templates Mamanunes nasceu da minha necessidade de registrar as descobertas que faço enquanto aprendo a desenhar templates para a plataforma Blogger. Compartilho aqui alguns truques, templates e informações que considero úteis para blogueiros e curiosos. Entre e fique a vontade.

Info

3.5.10

image

Veja esse aplicativo criado por  Jacob Cyrus Bijani ( Direto de criação doTumblr’s ) . Com o BORDER RADIUS não tem mistério. A única coisa que você precisa fazer é determinar o numero em px para cada canto e o aplicativo oferece o código correspondente para ser inserido no bloco que queira exibir arredondado, por exemplo as áreas de postagens do Blogger, Header, ou sidebar. É ótimo pra gente compreender esse truque em CSS.

Veja no exemplo abaixo, coloquei 10px para cada canto.

image

Neste outro exemplo, coloquei 50px para o topo a esquerda e 50px para o bottom a direita:

image

Veja um exemplo para deixar sua área de postagem separada por blocos e com formato de cantos arredondado. Faça o seguinte:

OBS: Exemplo criado em modelo “Mínima” do Blogger

Faça login no Blogger e no painel clique na opção ►Layout

Depois clique em ►Editar HTML

Procure pelo trecho .post{

Troque todo o trecho entre colchetes, pelo código abaixo destacado em vermelho.

.post {



margin:10px;
border:1px solid #cccccc;
padding:10px;
background: #E9EAEE;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;


}





Veja no blog de testes DEMO



 



Beijo da Mama ♥

11 comentários

Anônimo

Hi, Mamma...

Muito legal e prático! Pena que nem todo navegador reconheça/leia este recurso...

[]'s @inaciorolim

MamaNunes

<Inacio
Bem lembrado! Eu quase sempre esqueço que o IEca não sabe ler CSS3 kkkkk

beijo

Pena Digital

Mama, apliquei (substituí) o código mas não mudou nada na postagem. Visualizei com o firefox.

Max Martins

Oi, Mama!

Talvez você não lembre, mas tinha solicitado por e-mail a fórmula mágica pra separar as postagens resumidas na primeira página. Bem, descobri como se faz mas agora ficou bem melhor com as bordas arredondadas.
Excelente dica!

Um forte abraço!!!

Matheus

Excelente dica! Me foi muito útil. Quem quiser ver o resultado é só dar uma bizoiada na minha sidebar aqui: http://umblogsoda.blogspot.com/

Vitor Viana

Parabens muito bom. www.vitordesigner.com.br

FREE STEP

ha.ha! nem acho esse trecho no EDITA HTML..

Felipe Correia

:-) Massa Valeuu!

Gustavo Silva

Como fazer isso na sidebar (ou seja, aplicando o efeito à todos os elementos que compõem a sidebar)?

Obrigado desde já!

Andson Boa Sorte

valeu muito obrigado espero que posa ajudar vcs tamber visite meu blog andsondownload.blogspot.

Guilherme Nery

Sensacional !

Postar um comentário

Caso queira informações mais detalhadas, ou encomendar um template personalizado, use o Formulário de Contato ou meu Email. Responderei o mais breve possível.
Obrigada.