Home
Tutoriais
Efeitos
Ilustrações
Menus
Psds
Vagas
F.A.Q
Mapa
Layout free

Tutorial:Caixa de busca personalizada


Eae galeraa tudo numa boa com vocês?Bom,comigo tá né,tô de férias,mas estou mofando em casa.Acordar às 15h da tarde,existe algo melhor?Acho que só comer né? hahaha.Alguém aí já foi assistir A Culpa é das Estrelas? Eu fui com algumas amigas no começo do mês e o filme é simplesmente lindo cara,o livro já era demais,agora o filme então :o Saí da sala do cinema com os olhos vermelhos,parecendo que fumei um beck. Meu próximo plano de filme é Malévola,alguém já assistiu? Se já,comenta aí,diz se é legal e se vale a pena assistir.Bom,eu disse pra vocês que eu faria capas em psd certo?Só que meu pc ainda não voltou,então aguenta as pontas ae.Tem algum pedido de tuto?posta aí que eu corro atrás.Hoje eu vou ensinar como se faz o código de caixa de busca personalizada,igual essa do blog sabe?Os créditos vão para o blog Pequena garota.Bora?

.SEARCH{
FLOAT: LEFT;
FONT-FAMILY: ARIAL !IMPORTANT;}
.SEARCHBAR{
HEIGHT: 20PX; /*ALTURA DA CAIXA*/
WIDTH: 120PX; /*LARGURA DA CAIXA*/
TEXT-ALIGN:CENTER;
COLOR:#CORFONTE;
BACKGROUND: #BACKGROUND!IMPORTANT;
BOX-SHADOW: INSET 1PX 1PX 6PX  #DCDCDC;
FONT: 11PX ARIAL !IMPORTANT;
BORDER: 2PX SOLID  #000000;
-WEBKIT-BORDER-RADIUS: 10PX;
-MOZ-BORDER-RADIUS: 10PX;
BORDER-RADIUS: 10PX;
}
.SEARCHBUT{
BACKGROUND: URL('URL DO BOTÃO');
WIDTH:27PX; /*LARGURA DO BOTÃO*/
HEIGHT:20PX; /*ALTURA DO BOTÃO*/
BORDER: 0;
PADDING:2PX;
}
.SEARCHBUT:HOVER{
BACKGROUND: URL('URL DO BOTÃO HOVER');
WIDTH:27PX; /*LARGURA DO BOTÃO*/
HEIGHT:20PX; /*ALTURA DO BOTÃO*/
BORDER: 0;
PADDING:2PX

código:
<FORM ACTION="/SEARCH" CLASS="SEARCH" METHOD="GET"> <INPUT CLASS="SEARCHBAR" ID="S" NAME="Q" PLACEHOLDER='DIGITE O QUE PROCURA' TYPE="TEXT" VALUE="" /> <INPUT CLASS="" TYPE="SUBMIT" VALUE="" /> </FORM>
Bom,por hoje é só,espero que tenham gostado do tuto.Até mais,beijos!

3 comentários:

  1. eu assisti malévola >< perfeito cara
    gostei do tutorial ><

    ResponderExcluir
  2. onde eu colo isso? esse codigo? essas coisas ai?

    ResponderExcluir
  3. Oi , eu estava querendo uma ajudinha no meu blog. Pq ele está horrivel , eu queria saber como fazer um Layout e os gadgets tipo: Fics em Andamento , Finalizadas lendo pelo celular e como colocar o link. Me ajuda?

    ResponderExcluir