Membuat Kotak Pencarian dengan CSS

ikhsanudin on

Wednesday, March 13, 2013

Seperti telah di jelaskan pada posting sebelumnya tentang Cara buat Widget Search Box, maka kali ini saya mengulang kembali posting yang hampir sama dengan yang lalu. bedanya apa ya lihat saja nanti.


<style>
#namanyay-search-btn {
background:#0099ff;
color:white;
font: 'trebuchet ms', trebuchet;
padding:10px 20px;
border-radius:0 10px 10px 0;
-moz-border-radius:0 10px 10px 0;
-webkit-border-radius:0 10px 10px 0;
-o-border-radius:0 10px 10px 0;
border:0 none;
font-weight:bold;
}

#namanyay-search-box {
background: #eee;
padding:10px;
border-radius:10px 0 0 10px;
-moz-border-radius:10px 0 0 10px;
-webkit-border-radius:10px 0 0 10px;
-o-border-radius:10px 0 0 10px;
border:0 none;
width:160px;
}

</style>


<form id="searchthis" action="/search" style="display:inline;" method="get">
<!-- Search box for blogger by Namanyay Goel //-->
<input id="namanyay-search-box" name="q" size="40" type="text" placeholder=" Type! :D "/>
<input id="namanyay-search-btn" value="Search" type="submit"/>
</form>

sumber

Labels: Blogger, Tips dan Trik, Tutorial

Thanks for reading Membuat Kotak Pencarian dengan CSS. Please share...!