Image Map

21 fevereiro 2012

Como colocar os títulos das gadgets personalizados(pedido)+Novo blog

    Oi oi!
    Estou fazendo um tutorial por pedido no MSN da Sarah.

    Primeiro aperte ctrl+f e procure por:
Headings
    Vai aparecer assim:
h2 {
  font: $(widget.title.font);
  color: $(widget.title.text.color)

  Substitua essa tag por:

.sidebar h2 {
font-family: Century Gothic; /*Tipo de fonte*/
font-size: 16px; /*Tamanho da fonte*/
color: #000000; /*Cor da fonte*/
border-bottom: 2px solid #fff; /*Borda de baixo, apague se não quiser*/
background: #fbfbfb; /*Cor de fundo*/
text-align: center; /*Alinhamento do texto*/
}
Agora é só modificar as cores e a fonte como quiser. Se em vez de cor, você quiser colocar uma imagem de fundo, substitua essa parte:

background: #fbfbfb; /*Cor de fundo*/
      Por isso:
background: url(link_da_imagem) no-repeat center;
height: 30px;/*Altura da imagem*/
width: 200px; /*Largura da imagem*/ 

     Para colocar sombra:

text-shadow: 1px 2px 3px #codigo da cor aqui; 

Aumente os pixels para a sombra ficar maior e mude o código de cor pra mudar a cor da sombra.

Para as bordas arredondadas adicione esse código:
-moz-border-radius: 10px; /* Para Firefox */
-webkit-border-radius: 10px; /*Para Safari e Chrome */
border-radius: 10px; /* Para Opera 10.5+*/

Estilos de bordas:


Borda Solid
Código: Border: 1px solid #000000;

Borda Dotted
Código: Border: 2px dotted #000000;

Borda Dashed
Código: Border: 1px dashed #000000;

Borda Groove
Código: Border: 3px groove #aa3cff;

Borda Inset
Código: Border: 3px inset #aa3cff;

Borda Outset
Código: Border: 3px outset #aa3cff;

Borda Double
Código: Border: 3px double #000000;
Créditos das bordas:aqui


E contanto com o novo blog eu criei um para encomendas.Por que estava meio dificil de colocar uma página imensa de encomendas.Lá no meu primeiro post detalhei melhor.Clique aqui.


Bejinhos!

2 mil recadinhus,o seu já ta aqui?:

Kamilla Fernandes disse...

Adorei a dica, é sempre bom uns tutoriais^^
Beijos --> docinho-azul.blogspot.com

awn disse...

Muito obrigada!