Cute Search Button - Ash Princess Kawaii
Breaking News
08 April 2014

Cute Search Button

tutorial freebies

Cute Search Button is a button to search for articles that want to read, I modified the css is cuter.

Search Button Cute 1


kode:

<form action="/search" id="searchThis" method="get" style="display: inline;">
<div style="text-align: center;">
<input id="searchBox" name="q" onblur="if(this.value=='')this.value=this.defaultValue;" onfocus="if(this.value==this.defaultValue)this.value='';" style="background: #ffffff; border-radius: 5px; border: Pink solid 1px; color: #bfbbbd; font-size: 11px; padding: 4px; width: 210px;" type="text" value="Search here" vinput="" /> <input id="searchButton" style="background: Pink; border-radius: 5px; border: Pink solid 1px; color: white; font-size: 11px; padding: 4px;" type="submit" value="Search" /></div></form>

Search Button Cute 2



<form action="/search" id="searchThis" method="get" style="display: inline;">
<div style="text-align: center;">
<input id="searchBox" name="q" onblur="if(this.value=='')this.value=this.defaultValue;" onfocus="if(this.value==this.defaultValue)this.value='';" style="background: #ffffff; border:dashed 2px #f783f7; -moz-border-radius: 14px; -webkit-border-radius: 14px; border-radius: 14px; color: #333; font-size: 11px; padding: 4px; width: 210px;" type="text" value="Search here" vinput="" /> <input id="searchButton" style="background: #f783f7;-moz-border-radius: 14px;-webkit-border-radius: 14px;border-radius: 14px; color: white; font-size: 11px; padding: 4px;" type="submit" value="Search" /></div></form> 


Search Button Cute 3




 <form action="/search" id="searchThis" method="get" style="display: inline;">
<div style="text-align: center;">
<input id="searchBox" name="q" onblur="if(this.value=='')this.value=this.defaultValue;" onfocus="if(this.value==this.defaultValue)this.value='';" style="background: #ffffff; border:dashed 2px #83f7f7;-moz-border-radius: 6px;-webkit-border-radius: 6px;
border-radius: 6px; color: #333; font-size: 11px; padding: 4px; width: 210px;" type="text" value="Search here" vinput="" /> <input id="searchButton" style="background: #83f7f7;
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
border-radius: 6px;color: white; font-size: 11px; padding: 4px;" type="submit" value="Search" /></div></form> 


Search Button Cute 4



<form action="/search" id="searchThis" method="get" style="display: inline;">
<div style="text-align: center;">
<input id="searchBox" name="q" onblur="if(this.value=='')this.value=this.defaultValue;" onfocus="if(this.value==this.defaultValue)this.value='';" style="background: #ffffff; border:dotted 2px #8c623d;-moz-border-radius: 11px;-webkit-border-radius: 11px;
border-radius: 11px; color: #333; font-size: 11px; padding: 4px; width: 210px;" type="text" value="Search here" vinput="" /> <input id="searchButton" style="background: #8c623d;-moz-border-radius: 11px;-webkit-border-radius: 11px;
border-radius: 11px;color: white; font-size: 11px; padding: 4px;" type="submit" value="Search" /></div></form>  

0 Comments:

Posting Komentar

:) :)) ;(( :-) =)) ;( ;-( :d :-d @-) :p :o :>) (o) [-( :-? (p) :-s (m) 8-) :-t :-b b-( :-# =p~ $-) (b) (f) x-) (k) (h) (c) cheer
Click to see the code!
To insert emoticon you must added at least one space before the code.

 
tumblr_ln1i6xM1bx1qg9aa7