完成的事情：

仅完成“找职业”的导航、搜索部分，推荐职位部分和推荐公司的一半。。。

计划的事情：

继续页面样式。

问题：

添加了媒体查询，针对中间内容样式，大于1200px时候，显示宽度为1170px，大于992px时候，显示宽度为970px，其余设置为max-width:750px;和width:100%;

“找职位”的首页导航和搜索部分，暂时设定为小于992px时候，隐藏左侧导航条，后期测试时候若需要则改成在轮播图顶部显示，并从移动到上面显示右侧内容变成点击下拉显示内容。

“推荐职位”部分参考例子，使用col-sm-6和col-lg-3的栅格进行布局。

“推荐公司”部分，对

进行处理的时候，在psd中发现其中应用了带透明度的渐变背景，故设置

background: -webkit-gradient(linear, left top, left bottom, color-stop(100%,rgba(0,0,0,0.5)), color-stop(0%,rgba(255,255,255,0)));

复现效果。

图片正常显示，文字内容设置成绝对定位并调整位置。

对图片进行媒体查询，小于450px时候，宽度max-width:375px;和width:100%;

8个公司图标，里面的图片大小不一，不好对其规定具体大小，尝试使用

img{

max-width:80%;

max-height:60%;

margin:0 auto;

}

效果还不错。

图片和公司图标布局

<div class="row">

<div class="col-lg-4">

</div>

<div class="col-lg-8 row">

<div class="col-xs-6 col-sm-3">

<div><img src="img/213.png"></div>

</div>

。。。

</div>

</div>

媒体查询小于450px时候，公司图标从175*100变成130*80。完成效果如下

收获：

复盘项目的进度。自适应的理念。