今天完成的事情：

1、完善task3，task4的内容也完成了，除了输入框前面的图片垂直居中还没调试准确。

明天计划的事情：

1、完善task4；

2、开始task5；

遇到的问题：

1、Q：还是布局定位问题，尤其是盒子非常多元素非常多的时候！想定位的非常精准就有点困难，

      A：目前部分布局只能定位到大概位置，还不能精准到每个像素。

2  Q：分割线的问题。

   A ：  百度了一下，很简单，

<div class="table">
    <div style="text-align: center;;float: left;width:16%; ">
        <img src="lock.png">
    </div>
    <div style="width:1px; height:52px; border-right: solid 1px #e1e5e7;
            float: left;margin-top: 24px;">
    </div>
    <p><input type="text"  placeholder="请输入密码" ></p>
</div>

填充一个那么小的盒子设置边框就可以了。不知道鬼不规范，或者更简单的方法。

3 Q：task3里面的  两个小图片 和下面的两行字 的位置关系，如果用一个大盒子装2个小图片，文字也这样装，怎么才能在自适应的时候，上面图片的盒子和文字的盒子保持一定比例伸缩。

   A  ：  虽然后来师兄们建议用一个盒子装一个图片和一段字 占屏幕一般来居中，就可以了，可是还是想知道2个图片的盒子加2段文字的盒子怎么保持位置不变。

收获：百度到了这段代码，可以改变输入框里面的提示文字的颜色和指向它的时候的颜色。   不知道有没有简单点的方式，感觉代码好长！

input::-webkit-input-placeholder {
    color: #c2c2c2;
    text-indent:1em;
    -webkit-transition: color.5s;
}
input:focus::-webkit-input-placeholder, input:hover::-webkit-input-placeholder {
    color: #999;
    -webkit-transition: color.5s;
}