მთავარი » 2011 » ნოემბერი » 13 » Search Form
8:30 PM Search Form | |
Code <form action="#" id="search_box"> <div class="wrapper"> <input type="text" id="search" name="search" placeholder="Search for Music" /> <button type="submit" class="search_btn"><img src="search_icon.png" title="Search" /></button> </div> </form> Code #search_box { background:-moz-linear-gradient(top, #ffd73a, #ffa500); background:-webkit-gradient(linear, 0 0, 0 100%, from(#ffd73a), to(#ffa500)); border:1px solid #d28703; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; -moz-box-shadow:inset 0 1px #ffff90, inset 0 -2px 5px #ffd05d, 0 0 0 4px rgba(255,255,255,0.65); -webkit-box-shadow:inset 0 1px #ffff90, inset 0 -2px 5px #ffd05d, 0 0 0 4px rgba(255,255,255,0.65); padding:9px; width:570px; } #search_box .wrapper { background:#fff; border:1px solid #d28703; -moz-border-radius:2px; -webkit-border-radius:2px; -moz-box-shadow:inset 0 1px 2px rgba(0,0,0,.3), 0 1px #ff0; -webkit-box-shadow:inset 0 1px 2px rgba(0,0,0,.3), 0 1px #ff0; padding:13px 0 10px 8px; position:relative; } #search_box input { border:none; color:#333; font:bold 24px Helvetica, Arial, sans-serif; width:510px; } #search_box button { background:-moz-linear-gradient(top, #453e26, #000); border:1px solid #000; -moz-border-radius:2px; -webkit-border-radius:2px; -moz-box-shadow:inset 0 -2px 3px #193544, inset 0 1px #907817, 0 1px 1px rgba(0,0,0,4); -webkit-box-shadow:inset 0 -2px 3px #193544, inset 0 1px #907817, 0 1px 1px rgba(0,0,0,.4); cursor:pointer; height:45px; position:absolute; right:2px; top:2px; width:45px; } | |
|
სულ კომენტარები: 0 | |