Tutorial - Personalizando o menu pop-up

Bom, pra quem não sabe como é um menu pop-up personalizado, aqui tem o print de um.   Vamos começar!

1º passo: Vamos mudar o botão de close do seu menu. Não sabe o que é ? É isso aqui. Então você tem o código original do menu, não é ? Se for isso, procure no seu html por  ”http://www.sohtanaka.com/web-design/examples/modal-window/close_pop.png” e substitua isso pelo link do seu botão de close. (Se não tiver um ainda, pode pega aqui no HT, disponbilizarei alguns logo após esse tutorial.)

2º passo: Vamos agora personalizar a borda da ‘janelinha’. Não sabe do que eu estou falando ? Então vá no print daquele menu pop-up e veja o contorno em roxo. É a borda! Bom… vá no código 5 do tutorial de como fazer o menu pop-up. Procure por este código:

border: 20px solid #ddd;

O '20px' é a espessura da borda, pode trocar esse número pelo valor que quiser (lembrando que quanto maior o número, maio a espessura.) O 'solid' quer dizer que a borda é uma linha reta só. Você pode trocar por 'dashed' (traçejada) ou 'dotted' (pontilhada). E o '#ddd' é a cor da borda. Pode trocar o código que vem depois do '#' pelo código de outra cor. Para isso, consulte uma tabela de cores.

3ºpasso:  Mudando agora o fundo da janelinha (a parte branca onde fica o texto). Procure no código 5 esse código:

background: #fff;

Só trocar o ‘fff’ pelo código que você pegar na tabela de cores.

4ºpasso: Mudando o fundo da tela (a parte preta do print). Procure no código 5 o código:

background: #000;

E troca o ‘000’ pelo código que você pegar na tabela de cores.

Acabou, haha! Facil, né? Quaçquer duvida, recorra a ask! Beijos, thaty s2