กล่องค้นหาแท็บ TABAO เลียนแบบ เปลี่ยนเป็นเนื้อหาใดที่คุณต้องการค้นหา เพื่อนที่สนใจสามารถตรวจสอบรหัสด้านล่าง
<div> <div id = "searchbox"> <ul id = "tabbar"> <li tips = "โปรดป้อนชื่อผลิตภัณฑ์"> ผลิตภัณฑ์ </li> <li> <span> | </span> </li> <Li Tips = "โปรดป้อนชื่อร้านค้า"> ร้านค้า </li> id = "คำหลัก" name = "คำหลัก" lang = "zh-cn" type = "text" value = "โปรดป้อนชื่อผลิตภัณฑ์"> <ค่าอินพุต = "search" onfocus = "this.blur ()" type = "ส่ง"> </form> รองเท้า </a> <a href = "#"> รองเท้าผู้ชาย Shenggao </a> <a href = "#"> <pan> เสื้อผ้าผู้หญิง </a> </a> <a href = "#"> ครีมกันแดด </a> <a href = "#"> ครีมขนย้าย
.Search {ตำแหน่ง: สัมบูรณ์; ด้านบน: 14px; ซ้าย: 34%; ความกว้าง: 477px; _width: 477px; ความสูง: 81px;}. คำหลัก A {ตัวอักษรขนาด: 12px; ความสูงบรรทัด: 18px; สี:#999; Padding: 0 4px;}. คำหลัก A span {color: #fb5004;}. แท็บบาร์ li.current {color: #1D7AD9; Font-Weight: ตัวหนา; ความเป็นมา: url (../ images/trian_up.png) ศูนย์กลางที่ไม่มีการทำซ้ำ Padding-bottom: 9px;}. tab-bar li {width: 38px; TEXT-ALIGN: CENTER; สี: #444; ลอย: ซ้าย; เคอร์เซอร์: ตัวชี้;}. tab-bar li.tab-line {width: 2px; สี: #C9C9C9; มาร์จิ้น: 0 2px;}. Tab-Box {Border: 2px Solid #1D7AD9;}. ข้อความ {สี: #a9a9a9; ความกว้าง: 376px; ความสูง: 31px; ชายแดน: ไม่มี; Indent-Indent: 10px; ลอย: ซ้าย; โครงร่าง: ไม่มี; Border: 0;}. ปุ่ม {Width: 97px; ความสูง: 32px; TEXT-ALIGN: CENTER; สี: #FFFF; ขนาดตัวอักษร: 18px; ความเป็นมา: #1D7AD9; ชายแดน: ไม่มี; ลอย: ซ้าย;} <script type = "text/javascript"> $ (function () {// ค้นหาสลับ $ ('#tabbar') บน ('คลิก', 'li', function () {var tips = $ (นี่) .attr ('เคล็ดลับ'); ถ้า (เคล็ดลับ) {$ (นี่) .addclass ('ปัจจุบัน'). พี่น้อง (). RemoveClass ('ปัจจุบัน'); $ ('#คีย์เวิร์ด'). val (เคล็ดลับ);}}); </script>