今天完成的事情：

              1.完成了任务十三的重构，使用了《flex-basis》属性修改了，DIV内容由于缩放比例超出DIV的问题。

               而《flex-basis》这个代码的作用是：

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

.item {  flex-basis: <length> | auto; /* default auto */}

它可以设为跟width或height属性一样的值（比如350px），则项目将占据固定空间。

                          我对他的理解就是瓜分父值所留下来的空间，达到在百分比不均匀的时候占据剩余空间而不超出，相当于优化布局占据的比例。

          我使用的代码方式是这样的：把第一个盒子设置为《nth-child（1）》

                                                         然后把第二个盒子设置为《nth-child（2）》其中的宽度设置为百分比，然后这两个盒子会自动瓜分掉父级所留下的空间，而不会造成超出的错误。

明天的计划：

         尝试搭建自己的CSS库。

遇到的难题：

              在任务十三的重构中遇到了一个问题。

             任务十三由于布局问题我采用的都是统一的VW页面宽度百分比来进行布局，因为有一个统一的页面百分比这就就不会像是普通的百分比属性一样让我的盒子变成长方形，当我统一使用VW作为长度单位，我的DIV就变成了一个正方形。

             但是VW和普通的百分比不一样，他有一个滚动条的宽度不算计算在这个百分比之类、而滚动条的宽度大概为16PX。

            当页面缩放在最小的时候不会出现滚动条，因为他全部的内容都呈现出来了。

            当页面最大的时候由于浏览器原因，滚动条会被隐藏起来，也不会占据空间。

            由于我DIV设置的为33VW，那0.3的VW不足以支撑起16PX的滚动条，所以我的布局被打破。

            但是我把后面的宽度设置为百分比的时候，滚动条是会被计算进去的，所以不会出现被16PX卡主的尴尬，但是《borde-width》代码不支持单纯的百分比输出，。

收获：

            丰富了基础代码，巩固了所学知识，对布局和代码使用更加熟练。