Dona do Blog

Olá!Sejam Bem-Vindos! Eu sou a Lika,criei o blog com intenção de compartilhar esse mundo louco em que vivo,novidades asiáticas,música,cultura,beleza,moda e muitos entretenimentos!Daily Crazy é mais que um diário virtual,uma EMOÇÃO! Hora de Explorar?

Afiliados ~

27 de out de 2012

Caixa de Pesquisa personalizada

Tutorial!!!

O tutorial é super simples,é só prestar um pouco de atenção que dá tudo certo...
Na caixa de pesquisa você pode colocar uma imagem no lugar do botão.
Quer aprender? Siga-me os Crazy's#
Vá em layout e cole o código abaixo em um gadget de html/javascript:

<form action="/search" class="search" method="get">
<input class="searchbar" id="s" name="q" placeholder='Digite o que procura' type="text" value="" />
<input class="searchbut" type="submit" value="" />
</form>
  Você pode substituir o texto em azul pela frase que quiser.

Agora vá em modelo - editar html e cole antes de ]]></b:skin> o código abaixo:

.search{
float: left;
font-family: Century Gothic !important; /* Fonte do campo de texto*/
}
.searchbar{
height: 20px; /*Altura da caixa*/
width: 190px; /*largura da caixa*/
border-radius:15px;
background:#fff;
text-align:center;
color:#ff048c !important; /*cor do texto*/
font: 12px Century Gothic !important; /*fonte do texto*/
}
.searchbut{
background: url('Url da imagem do botão');
width:30px; /*Largura do botão*/
height:30px; /*altura do botão*/
border: 0;
padding:7px;
}


Agora é só alterar do seu jeito,caso há dúvidas pode deixar nos comentários...

Créditos à Cherry Bomb


Gostou do Post?Comente!

Nenhum comentário:

Postar um comentário

Coment Here ;D

Se você quiser expressar um pouco
sinta-se à VONTADE!

Related Posts Plugin for WordPress, Blogger...
S Pink Premium Pointer