Skrip berikut ini adalah bagian dari tutorial ” Cara Membuat Kotak Pencarian Search HTML CSS “, silahkan anda uji coba dengan mengkopi paste atau ketikkan skrip berikut dalam teks editor anda. Berikutnya anda jalankan melalui browser kesayangan anda.
Untuk lebih jelasnya dalam memahami dan menggunakan skrip berikut, silahkan anda kunjungi ” Cara Membuat Kotak Pencarian Search HTML CSS “.
<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>Judul Halaman Saya</title> <style type="text/css"> form { width:500px; margin:50px auto; } .search { padding:8px 15px; background:rgba(50, 50, 50, 0.2); border:0px solid #dbdbdb; } .button { position:relative; padding:6px 15px; left:-8px; border:2px solid #53bd84; background-color:#53bd84; color:#fafafa; } .button:hover { background-color:#fafafa; color:#207cca; } ::-webkit-input-placeholder { /* For WebKit browsers */ color: #dd3333; font-family:Helvetica Neue; font-weight:bold; } :-moz-placeholder { /* For Mozilla Firefox 4 to 18 */ color: #dd3333; font-family:Helvetica Neue; font-weight:bold; } ::-moz-placeholder { /* For Mozilla Firefox 19+ */ color: #dd3333; font-family:Helvetica Neue; font-weight:bold; } :-ms-input-placeholder { /* For Internet Explorer 10+ */ color: #dd3333; font-family:Helvetica Neue; font-weight:bold; } </style> </head> <body> <form> <input class="search" type="text" placeholder="Cari..." required> <input class="button" type="button" value="Cari"> </form> </body> </html>
Oke, Mas. Akan saya coba. Mudah2an info ini memberi pemahaman baru bagi saya. Terima kasih.
ini kalo dah di klik udah bisa nyari ga ?
belum bisa, harus memakai php