今天完成的事情：

今天研究了编码规范和命名规范，尝试写页面的时候规范命名。

根据规范完成了任务13的页面1重构，简单了解了css架构思路。

优化任务12重构页面，主要优化重复部分属性，尽可能尝试更简洁代码。

之前没有使用嵌套，规范命名+嵌套使用，污染其他元素的可能性更小。

布局 grid/g-: 我们将页面分割为几个大块，通常有头部、主体、主栏、侧栏、尾部等。

模块 module/m-：即语义化的可以重复使用的较大的整体。如导航、登陆、注册、列表、评论、搜索等

元件 bunit/u-：通常是一个不可再分的较为小巧的个体，被重复用于各种模块中，比如按钮、输入框、loading、图表等

功能 function/f-：为方便一些常用样式的使用，我们将这些使用率较高的样式剥离出来，按需使用，通常这些选择器具有固定样式表现，比如清除浮动。

明天计划的事情：

完成任务13，继续了解css重构。

完成小课堂基本资料收集。

收获：

任务名称：css11

成果链接：https://lareina-wzy.github.io/test/ task11/html/task11.html

任务耗时：2019.11.03-2019.11.03 一天

官网脑图：

我的脑图：

任务十一主要内容是学习sass知识点后，运用sass，sass的安装以及如何在vscode中使用，再利用sass重构任务4简单登录页面。难度不大，但需要转换思维，发挥sass优势。

任务总结

      任务名称：CSS-task12   

      任务成果：https://lareina-wzy.github.io/test/task12/html/task12-1.html

     任务耗时：2019.11.04-11.04(1天)

官网脑图

我的脑图：

重构任务5、6页面的时候，发现使用sass加上对布局较熟练，速度比之前快了很多。sass的继承能够省略很多重复属性，混合器@mixin +@include，可以提前调用事先编写的常用代码组，比如flex布局，position定位，font相关设定等，熟练之后能够节省很多时间。

变量在设置背景色和某些统一属性值的时候很方便。

比如可以直接将背景色定为几个色值变量，后期页面色彩若有修改，可直接修改变量。

再如矩形圆角等属性，能够方便页面统一。

嵌套在sass里看起来很方便，但编译成css后可能会多出很多不必要的内容，使用需谨慎。

同一样式的两个不同元素就可以用继承，也可以用混合器。

混合器可以提前设定部分统一属性，然后通过@include调用。

比如flex布局的常用垂直水平居中布局。

或者同一类元素设定的margin和padding值。

比如bootstrap中，每一列都自带15px的边距。可以提前设定后，直接调用。

条件语句if暂时没有用上，可以用于判断width后编写不同效果。