今天完成的事情：

  重新使用盒子模型做好了任务3的布局，单位从PX更换为了rem玩成了自适应，使用css外联的方式重新写了任务3的代码。

  建立一个后缀为.css的文件，把style的代码写在里面，在HTML的head标签里面写下：

<limk renl="stylesheet" href="..在此处链接节进css文件">

  使用盒子模型的margin-left和margin-bottom两个属性布局了任务3页面左上角的箭头，并把PX单位换算成了rem单位，使图片可以自适应移动端的界面。

  给葡萄藤LOG的父元素设置了text-align:center属性，使葡萄藤LOG达成了位置的居中。

  利用给父元素设置文本居中，子元素继承父元素居中属性的情况下，给子元素设置了text-align:left 文本排序：左， 完成了任务3页面的中间在文字在多行时，保持最后一行文字靠左排列，整体居中的效果。

  页面下方的两个图标使用浮动，float:left float right 使两个图标的父元素框分别布局在左右两侧， 最后盒子模型里margin的top right align 三个属性完成了布局，这里同样用到了text-align 来完成图片和文本的居中.

明天计划的事情：

 学习如何改变表单元素样式，重新温习定位属性的相对、绝对、浮动三个属性。查看学习任务4所需要的相关资料。

遇到的困难：

  今天在做任务3页面中间文字的布局时，第一次做出的效果可以达到居中，但是在分辨率缩小，文字多行的情况下，段落最后的文字也是居中的，无法达到像是示例图那样，末端文字靠左排列。尝试了给父元素设置文本居中的情况下，再次设置了文本靠左，结果两个属性只能实现一个文本居中，文本靠左的属性无效。

 随后尝试了绝对定位，使文字在多行显示的情况下完成了末端靠左侧排列并整体居中，但是当页面放大时，文字变为单行排列时又无法居中了。后面查到了text-align:left  text-align;center 两个属性同事使用的方法，因为text-align;center属性可以继承的关系，在子元素继承了文本居中属性的前提下，自身可以设置文本居左的属性，产生在文字多行的情况下靠左，单行的情况下居中。然后给元素设置一个和合适的宽度来完成多行下的居中效果。

收获：

  通过今天完成的任务3再次加深了对盒子模型的理解，对rem单位的原理理解的更加清晰，学会了文本居中的情况下同时靠左排列。