Caixinha para pesquisa personalizada

  Caixa de Pesquisa Personalizada



Pra começar Voce Vai adicionar hum dispositivo de  HTML / JavaScript , Onde Voce Quer Que Fique a SUA caixinha de Pesquisa, cole Dentro do dispositivo o Código abaixo e salve.

<Form action = "/ search" class = "pesquisa" method = "get">
<Class = input "searchbar" id = name = "q" type = valor "s" "text" = "" />
<Class = input type "searchbut" = "submit" value = " GO "/>
</ Form>


Localidade: Não Precisa Change nada, mas Onde ESTA los negrito  GO , VOCE PODE POR substituir outra Palavra ...

DEPOIS Que SALVAR o dispositivo VÁ los  Modelo  >  EDITAR HTML >  Pressione:  Ctrl + F  e Procuradoria Por:  ]]> </ b: skin>  , e cole Acima:

.search { / * Parte Nesta Localidade: Não MUDE NADA * /
float: left;
margin-left: 30px;
font-family: Tahoma, Tahoma;
}
.searchbar {
height: 18px;
width: 140px; / * Largura * /
margin-left: 0px;
margin-top: -45px;
margin-bottom: -18px;
color: # FF84AD ; / * Cor Que Aparece when digitamos Algo * /
border: 1px solid #ddd;
padding: 3px 5px;
border-radius: 10px;
box-shadow: 0 1px 0px rgba (0,0,0, 0,1);
background: # fff ; / * Cor de Fundo * /
background: webkit-gradient (linear, superior esquerdo, inferior esquerdo, de (# fff), a (#ededed));
background: -moz-linear de gradiente (superior, #fff, #ededed);
Filtro: progidXImageTransform.Microsoft.gradient (startColorstr = '# ffffff', endColorstr = '# ededed');
-ms-filtro: progidXImageTransform.Microsoft.gradient (startColorstr = '# ffffff', endColorstr = '# ededed')
}
.searchbut {
border: 2px sólida # FF84AD ; / * Borda faz o botão normal, Apague se de: Não Quiser * /
float: right;
background: #FFF ; / * Fundo faz o botão * / normal
cursor: pointer;
color: # FF84AD ; / * Cor da Letra faz o botão * / normal
padding: 0 5px 5px 2px;
height: 26px;
margin-top: -20px;
margin-right: -35px;
font-family: Tahoma, Tahoma;
border-radius: 25px;
webkit-transition-duration: .5s
}
.searchbut: hover {
background: #FFF ; / * Fundo faz o botão Passe * / 
color: # 734836 ; / * Cor da Letra faz o botão Hover, Apague se de: Não Quiser * / 
border: 2px sólido # 734836 ; / * Borda Hover * /
webkit-transition-duration: .5s
}

O Faça como alterações that preferir, NAS somente contraditório Que estao los  Negrito . Salve e pronto.

Nenhum comentário:

Postar um comentário


Restaurar um blog excluido

Se você acidentalmente excluiu seu blog e quer tê-lo de volta, pode recuperá-lo durante um breve período após a exclusão. Para desfaz...