小问题。请问CSS如何做以下搜索框的效果。JS也行

JavaScript013

小问题。请问CSS如何做以下搜索框的效果。JS也行,第1张

不好意思刚弄错了,box-shadow是吧?这个代码在chrome里可以。

<html>

 <head>

  <title>测试</title>

  <style type="text/css">

   .inputBox{

    border:3px solid rgb(247, 242, 242)

    width:350px

    height:30px

   }

   .inputBox:focus{

    border:1px solid rgb(212, 235, 247)

    box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(82,168,236,.6)

   }

   .btnBox{

    width:50px

    height:30px

    background:white

   }

  </style>

 </head>

 <body>

  <input type="text" class="inputBox">

  <input type="button" value="Go!" class="btnBox"></input>

 </body>

</html>

a 中添加 onclick=doClick() (添加点击事件) href="javascript:" (让点击超连接不跳转 而是只为流js操作)

要隐藏的标签加上个 id="clickid"(id 你自己选)与下文的一致

js中中

function doCLick(){

var id= document.getElementById("clickid");//选中元素

id.style.display="none" 改变元素的 display 为none

}

基本就这个思路 js用的人不多了 很多都用 jquery ,不懂私信我