小编Sas*_*ith的帖子

我想通过 css 和可能的 jQuery 来实现这种效果。也就是说，创建一个隐藏的搜索栏，并且在单击标签中的搜索图标时可以很好地向左滑动。但我就是做不到。我确实取得了一些成就，但相当无聊。我想要的过渡是与 W3school 和许多其他网站中的过渡相似。这是我的代码：

   <nav> 
       <ul>
           <li><a href="#">Home</a></li>
           <li><a href="#">About</a></li>
           <li><a href="#">Contac</a></li>
     </ul>  

       <div id="search-enclose">
            <form>
                 <div id="label-enclose">
                      <label></labe>
                 </div>
                 <div id="input-enclose">
                      <input type="text" placeholder="Enter Keyword">
                 </div>
                 </form>
                 </div>
   </nav>

CSS：

 nav {
          position: relative;
     }
     ul {
          position: absolute;
          left: 25%;
          list-stye: none;
          z-index: 10;
       }
      li{
          float: right;
        }
        #search-enclose {
             width: 500px;
        }
        #label-enclose {
              position: absolute;
              top: 46px;
              left: 30%;
              height: 35px;
              width: 60px;
              line-height: 35px;
              z-index: 20;
         }

              #label-enclose label {
              display: …

我需要在图像中创建两个div.两者都可以有背景图像.任何人都可以帮忙吗？

两个div http://development.230i.com/tsips_new/v2/images/Untitled.png