今天完成的事情：

完成了任务十； CSS制作流程图； CSS模拟表单元素； 熟练响应式布局，

做任务有时候没仔细观察psd图片，

明天计划的事情：

重新检查以前的代码，并对以前的任务的代码进行规范化，并且使用scss编译；

遇到的问题：

对css的规范不熟悉，以下参考网易的NEC规范，简单的排序跟命名错误

单行写完一个选择器定义

便于选择器的寻找和阅读，也便于插入新选择器和编辑，便于模块等的识别。去除多余空格，使代码紧凑减少换行。

如果有嵌套定义，可以采取内部单行的形式。

1 2 3 4 5 6 7 8 9 10 11

/* 单行定义一个选择器 */ .m-list li,.m-list h3{width:100px;padding:10px;border:1px solid #ddd;} /* 这是一个有嵌套定义的选择器 */ @media all and (max-width:600px){     .m-class1 .itm{height:17px;line-height:17px;font-size:12px;}     .m-class2 .itm{width:100px;overflow:hidden;} } @-webkit-keyframes showitm{     0%{height:0;opacity:0;}     100%{height:100px;opacity:1;} }

最后一个值也以分号结尾

通常在大括号结束前的值可以省略分号，但是这样做会对修改、添加和维护工作带来不必要的失误和麻烦。

省略值为0时的单位

为节省不必要的字节同时也使阅读方便，我们将0px、0em、0%等值缩写为0。

1	.m-box{margin:0 10px;background-position:50% 0;}

使用单引号

省略url引用中的引号，其他需要引号的地方使用单引号。

1 2	.m-box{background:url(bg.png);} .m-box:after{content:'.';}

使用16进制表示颜色值

除非你需要透明度而使用rgba，否则都使用#f0f0f0这样的表示方法，并尽量缩写。

1	.m-box{color:#f00;background:rgba(0,0,0,0.5);}

收获：

看了网易的NEC规范，对css的顺序书写，命名规则有了一定了解认识，但是还需要多看

以后代码的方向尽量向html语义化方向靠拢，

使用类选择器，放弃ID选择器；

命名应简约而不失语义；

防止污染和被污染；