3 de set de 2013

Voltei + modelo de sidebar


Olá bebes o3o

Me desculpem mesmo por não ter postado esses dias,meu pc queimou do nada e agora vou ter que mandar formata-lo (de novo), não sei oque esta acontecendo com ele,vive dando problemas e ainda pra situação melhorar,meus créditos teriam de acabar,quer dizer não teria chances nenhuma de postar pelo menos um aviso a vocês,mas enfim estou com o notebook emprestado de parentes ate que o meu fiquei pronto e formatado,enfim irei postar somente tutoriais,enquanto eu tiver com este note,pois não tem editores,de imagens pra postar outras coisas do tipo a vocês,espero que entendam ><~

Trouxe um modelo de sidebar para vocês ele e simples e fofo,mas muito fácil de aplica-lo,e deixa o layout muito delicadinho,enfim siga o tutorial abaixo para aplicar o seguinte modelo,


Para usar este modelo, primeiramente procure por ]]></b:skin> e cole o código abaixo:

@font-face {font-family: "ayear"; src: url('http://static.tumblr.com/dlelfro/OsXmnntw9/ayearwithoutrain.ttf');}


Depois, procure por .sidebar .widget { e substitua tudo nesse seletor pelo código abaixo:

.sidebar .widget {

background: #fff;
padding: 10px;
border: 1px solid #FFE9D4; /*cor da borda da caixinha */
font-family: Trebuchet MS; /* fonte do widget */
text-align: center;
}

Agora procure por h2 { e substitua tudo nesse seletor pelo seguinte código:

h2 {background: #FFE9D4; /* cor de fundo do título do widget */ font-family: ayear;font-size: 16px;font-weight: normal;color: #c87f4b; /* cor da fonte do título do widget */line-height: 12px;padding-top: 8px;margin-bottom: 4px;-webkit-box-shadow: inset 0px 0px 6px #FDC69F; /* sombra interna do título do widget */-moz-box-shadow: inset 0px 0px 6px #FDC69F;-o-box-shadow: inset 0px 0px 6px #FDC69F;}
Altere as cores,visualize e salve,muito fácil e simples,espero que tenham gostado lindos,beijos.

5 comentários:

Seja Educado
Comente sua opinião
Qualquer erro,reclame
Comente e seja feliz <3