页面的head部分，需远程调用bootstrap.css样式文件，并引入一个style.css文件，代码如下：

<link type="text/css" rel="stylesheet" href="http://apps.bdimg.com/libs/bootstrap/3.3.4/css/bootstrap.css">
<link type="text/css" rel="stylesheet" href="css/style.css"/>

页面的body部分，主要将多个元素放入一个div容器里，代码如下：

<div id="top-image">
  <div id="content" class="container center-block">
    <div class="jumbotron">
      <div class="container">
        <h1>搜索框</h1>
        <p>带视差背景</p>
        <div class="input-group input-group-lg"> <span class="input-group-addon" id="sizing-addon1"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span></span>
          <input type="text" class="form-control" placeholder="输入关键词" aria-describedby="sizing-addon1"/>
          <span class="input-group-btn">
          <button class="btn btn-default" type="button">搜 索</button>
          </span>
        </div>
      </div>
    </div>
  </div>
</div>

页面的底部，需要引入jQuery库和一个JS插件，然后启用该插件，代码如下：

<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/ios-parallax.js"></script> 
<script type="text/javascript">
$(document).ready(function() {
  $('#top-image').iosParallax({
	movementFactor: 50
  });
});
</script>