2.3.13

Eu cheguei + Tutos



Hello guys!Sou a nova postadora do DW (vamos dizer assim).Na verdade eu não sou bem uma nova postadora, é só uma postagem mesmo ver se eu vou me sair bem.Bem, aqui a minha "área" vai ser de tutos.
Agora sobre a postagem, foi difícil escolher um tuto pra vocês,então eu estava em duvida sobre um e outro, e resolvi postar os dois.Vamos lá?
Vamos começar primeiro, com o mais fácil, depois vamos para o mais complicadinho.


1.Personalizando a Barra de Rolagem.



A barra de rolagem tem dois modelos, quadrada e redonda.Resolvi ensinar os dois modelos porque tem gente que gosta de um modelo e a outra não gosta, prefere de um modelo diferente.

Vamos parar de enrolar porque temos mais coisa pela frente.

Vá em modelo > Editar HTML > Procure por > ]]></b:skin> 
Em seguida, escolha o código da sua barra, redonda ou quadrada.



Barra Redonda
::-webkit-scrollbar-thumb:vertical {
background: #e7b3c2;height:50px;
border: 2px solid #fff;box-shadow: 2px 2px 4px #bebdbd;
-moz-box-shadow: 2px 2px 4px #bebdbd;
-webkit-box-shadow: 2px 2px 4px #bebdbd;
-khtml-box-shadow: 2px 2px 4px #bebdbd;
-moz-border-radius: 10px; /* Para Firefox */
-webkit-border-radius: 10px; /*Para Safari e Chrome */
border-radius: 10px; /* Para Opera 10.5+*/
}
::-webkit-scrollbar-thumb:horizontal {
background-color:#f26d92; height:10px;
border: 1px dashed #fff;
-webkit-box-shadow:0 0 1em #eee; }:
::-webkit-scrollbar {height:10px; width:20px; background: url(fundo da barra de rolagem) repeat;box-shadow: -3px -2px 10px #bebdbd;
-moz-box-shadow: -3px -2px 10px #bebdbd;
-webkit-box-shadow: -3px -2px 10px #bebdbd;
-khtml-box-shadow: -3px -2px 10px #bebdbd;}

Barra Quadrada
{
scrollbar-face-color:#9B30FF;
scrollbar-highlight-color:#9B30FF;
scrollbar-3dlight-color:#000000;
scrollbar-darkshadow-color:#000000;
scrollbar-shadow-color:#9B30FF;
scrollbar-arrow-color:#000000;
scrollbar-track-color:#000000;
}
::-webkit-scrollbar {width: 12px; height: 4px; background: #000000; }
::-webkit-scrollbar-thumb { background: #9B30FF; }

Pronto.Agora é só personalizar do seu jeito.






                                                   2.Coluna de gadgets em cima



O resultado será esse:

 1.Modelo > Editar HTML > Ctrl  + F (ou F3) > Pesquise por:

.main-inner .column-left-outer {  - Se sua coluna for do lado esquerdo
.main-inner .column-right-outer { - Caso ela seja no lado direito 

Então adicione o código abaixo, depois do código que você procurou.
margin-top: -150px;

Vá aumentando os números se você quiser que fique mais acima.

Expliquei direitinho?Ufa!Espero que sim!Beijos!

Nenhum comentário:

Postar um comentário

Que bom que vai comentar !!
Mais para fazer isso leia as regrinhas:
- Aceito criticas ,sugestões e opiniões.
- Seguindo segue de volta,se comentar sobre o post.
- Não retribuirei a visita se não comentar sobre a postagem.
- Deixe o link do blog para eu retribuir a visita.
Eu e o DW agradecemos ! Fique com Deus .