1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 <title>去除input的边框</title> 6 <style> 7 input{text-indent: 1em;} 8 #search1{ } 9 #search2{ border-width: 0; } 10 #search3{ border:1px solid red; } 11 #search4{ outline:medium;} 12 /*获取焦点时 外边框显示红色*/ 13 #search4:focus{ border:1px solid red; } 14 #search5:focus{ border:1px solid red; } 15 #search5: { appearance: none; } 16 17 18 </style> 19 </head> 20 <body> 21 <br/> 22 <input type="text" id="search1" name="search" 23 placeholder="请输入搜索内容1" /> 24 25 <input type="text" id="search2" name="search" 26 placeholder="请输入搜索内容2" /> <br/><br/> 27 28 <input type="text" id="search3" name="search" 29 placeholder="请输入搜索内容3" /> 30 31 <input type="text" id="search4" name="search" 32 placeholder="请输入搜索内容4" /> <br/><br/> 33 34 <input type="text" id="search5" name="search" 35 placeholder="请输入搜索内容5" /> <br/><br/> 36 37 </body> 38 </html>