将搜索框插入标题图像

Question

我希望将搜索栏插入/移动到我的标题图像中，类似于下面的示例。如果有人花了一分钟时间告诉我如何完成这一点，我将不胜感激。谢谢你的时间。这是我的网站http://www.jobspark.ca/

的链接

克里斯

Answer 1

只需在

中添加搜索框即可

<div id="logo" class="image">
    ...
    <h1>
      ...
    </h1>
    "search box code goes here"
</div>

使用CSS填充在搜索div和Finally位置给出一个id。

Answer 2

您可以将背景图像保留为正文标记。设置不重复，使用背景大小为100％宽度。

 example:

    body{
           backgroud-image:url() no-repeat center;
           background-size: --;
         }
      HTML STRUCTURE:



 <div id="header">
        <div ="#"> 
           <h1></h1> //float:left
           <div id="menu"></div> //float:right;

         </div>

        <div ="search-box">
             <form>

             </form> //use margin and padding for keep it center;
        </div>

     </div>