今天完成的事情：

 更了解了flex，用到了flex的弹性布局，

 display: flex;

任何一个元素都可以用

display: inline-flex;

行内元素用的，  flex布局用到的时候，浮动的效果是没有的，不过可以用绝对定位来固定元素。

今天知道了3个元素，行内元素，块级元素，行内块级元素。

(1)display:inline;转换为行内元素

　　(2)display:block;转换为块状元素

　　(3)display:inline-block;转换为行内块状元素

行内元素特征：设置宽高无效

　　　　　　　　　对margin仅设置左右方向有效，上下无效；padding设置上下左右都有效，即会撑大空间，

　　　　　　　　　不会自动进行换行。

　块状元素特征：能够识别宽高

　margin和padding的上下左右均对其有效以自动换行，

　　多个块状元素标签写在一起，默认排列方式为从上至下。

还有css代码一定要规范。找到了如何改变框颜色，使页面元素始终自适应，左边元素固定。

明天计划的事情：写任务6

遇到的问题：

布局时出现了问题，字太多把左边元素挤的变形，用了flex的弹性布局，

flex布局时不能用浮动导致箭头无法到左上角，我最后用的绝对定位，

箭头的问题，一开始用的是符号，改变他的大小然后达到效果，师兄告诉我了问题，然后用代码写了一个，用绝对定位与垂直居中，定位它的位置达到效果

。下面的字被页面底部挡住，用了一个特别大的下边距，然后解决了这个问题。

收获：

学会了弹性布局，知道了布局要多样化，不同的点不同的方式，不同的解决办法，同样bug也很多，在多个元素聚在一起时，就会出现各种bug，认识到了css语言规范的重要性，不同的角度思考问题，就会有不同的收获。

脑图任务5

任务5总结：任务5完成了我感觉自己完成的有点水，一个页面的布局，应该统一。任务5让我学到了：

1.处理更复杂的移动端页面； 2.同样是左中右的布局，可以用很多不同的方法来完成； 3.用css3的方法更好地拉伸背景图。

我用了很多的方法发现flex布局很好用，弹性布局可以适应各种浏览器，但同样用了flex之后就无法使用浮动来改变元素位置，任务5让我也知道了什么是看行内块级元素，如何关闭块级元素成为行内元素，垂直居中会使文字元素，更加的好看，flex方便了我再去给他垂直居中，给一个行高就可以。

任务5深度思考：