今天完成的任务：

  1，任务五主题内容边框的设置，参照李婷师姐的某篇日报，使用padding值把盒子撑起来，之后再设置边框。特点：简单快捷。 

 2，对flex布局的理解：

  1，flex布局有六个属性设置父元素上：

   1）flex-direction 设置主轴对齐方式，默认是X轴，方向是从左到右；

   2）flex-warp元素，采用的是子元素换行的方式，默认是nowrap禁止文字进行换行；

   3）flex-flow属性是flex-direction和flex-warp的缩写，默认为row nowarp；

   4）jutify-content是才用子元素对齐的方式，默认flex-start布局开始左右对齐;

   5)align-items：align-items：交叉轴如何对齐，如果flex-direction：row和row-reverse  那么交叉轴就是y轴，如果是column和column-reverse那么交叉轴是x轴，默认为stretch,如果没有设置高度或者设置为auto，将占满整个容器的高度

   6）align-content属性：采用了多根轴线的对齐方式，如果只有一个轴线，这个属性就会失去效果，默认值也是stretch。轴线将占满整个交叉轴。

 2， 同样也有六个属性设置在子元素上：order、flex-grow、flex-shrink、flex-basis、flex、以及align-self，order  

子元素排列的位置默认是按照html先后顺序来排列的，html结构谁在前面默认就排列在前面；order的作用就是改变子元素排列顺序 、

  1）order：默认（0） 值越小越靠前、

  2）flex-grow  放大比例  默认是0   当有放大空间的时候，值越大，放大的比例越大、

  3）flex-shrink:缩小比例  默认是1  值越大，缩小的时候比例越小；

  4）flex-grow：0.flex-basis  属性定义了在分配多余空间之前，占据的主轴空间（main size）。浏览器根据这个属性，计算主轴是否有多余空间。它的默认值为auto，也就是本来大小。 

  5）flex属性是flex-grow,flex-shrink 和flex-basis的简写，默认值为0 1 auto。后两个属性可选。

  6）align-self属性允许单个的有与其他不一样的对齐方式，可覆盖align-items属性。默认值为auto，表示继承父元素的align-items属性，如果没有父元素，则等同于stretch。

  明天的计划：

    任务六细节的完善，各项准备工作已就绪，开始任务七的编码。