一、今日完成的情况

1、总结任务十一，梳理深度思考。

2、开始做任务十二，重写任务5。

二、明天的计划

1、继续做任务十二，重写任务6。

2、JS前期准备，学习基础知识。

三、遇到的问题

暂未遇到疑难问题。

四、收获

      1、 深度思考：如何使用less?

      首先理解一下less的定义：less和sass一样，less也是一种CSS预处理语言，它使用类似CSS的语法，为CSS的赋予动态语言的特性，如变量、继承、运算、函数等，更方便CSS的编写和维护。可以在多种语言环境中使用，包括浏览器端、桌面客户端、服务端。那么如何使用less呢？我们可以通过三种方法来使用less。第一种：直接在html文件中引入less.js和styles.less文件。第二种：使用一些工具编译less文件，监测指定的less文件的变化，如果检测到变化，则自动将less文件输出成相应的css文件。第三种：使用服务器端编译less。和sass的语法类似，less也有定义变量，可以用嵌套的方式编写层叠样式等语法。

  2、 深度思考：如何使用sass?

      Sass编译方式有三种：通过命令行编译、GUI可视化图形同居编译及自动化编译。常用基本语法有：定义变量、嵌套、代码重用等等，通过创建scss文件，来编写代码，再使用上诉的编译方式，最后引入到我们的html文件之中，就是sass最基本的用法。

  师兄指出了一个知识盲点，需要注意一下：webstorm在编译SASS时，有时会出现修改的样式没有成功，因为webstorm在把SASS编译为CSS时没那么快。不过这种情况相对少见。

  3、 深度思考：less和sass有什么区别？

  （1）Less和Sass的主要不同就是他们的实现方式。

  （2）Less是基于JavaScript，是在客户端处理的。

  （3）Sass是基于Ruby的，是在服务器端处理的。

  （4）关于变量在Less和Sass中的唯一区别就是Less用@，而Sass用的是$。

  4、 深度思考：如何使用gulp编辑less？

  本次任务主要使用了webstrom来编译scss，暂时没使用到gulp，只初步了解了gulp的基本定义。Gulp是一个基于流的自动化构建工具，可以帮我实现很多的功能，比如代码编译、压缩等等。待之后涉及到gulp再深度探讨。

  5、 Sass语法：代码重用的两种方式

  （1）、sass中，选择器继承可以让选择器继承另一个选择器的所有样式，并联合声明。使用选择器的继承，要使用关键词@extend，后面紧跟需要继承的选择器。

  （2）、sass中使用@mixin声明混合，可以传递参数，参数名以$符号开始，多个参数以逗号分开，也可以给参数设置默认值。声明的@mixin通过@include+minxin名称来调用。

任务名称：CSS-TASK-11

成果链接：任务十一

任务耗时：5月22日-5月24日，耗时3天。

技能脑图：

个人脑图：

官网脑图：

任务总结：

1. 1.        任务进度符合预期，未延期。任务十一没有太多的新知识，就是使用scss对任务四的登录页面进行重构，基本没有遇到太多的问题，在做这个任务的过程之中，主要学习和使用了sass相关的基础知识，本次任务只使用到了，变量、继承和嵌套，其他的，例如运算和函数等语法还未涉及到，暂时还没使用过。对sass的使用还太浅显，需要在往后的任务中夯实基础。
             做完任务，梳理了一下深度思考，本次任务使用的是sass，趁着深度思考，也对less也有了初步的了解。
             sass和less有什么区别？

          （1）Less和Sass的主要不同就是他们的实现方式。
          （2）Less是基于JavaScript，是在客户端处理的。
          （3）Sass是基于Ruby的，是在服务器端处理的。
          （4）关于变量在Less和Sass中的唯一区别就是Less用@，而Sass用的是$。

   2.        脑图对比分析：基本符合官网预期，自己的脑图提到了sass，由于没有使用less，没有将less的相关知识点添加上去。
   3.        任务中遇到的疑难问题，任务十一遇到一个sass安装的问题，卡了一个晚上。
      

              问题描述：安装ruby，使用命令gem sources -a https://gems.taobao.org/ 安装源的时候，报错，错误代码：SSL_connect returned=1 errno=0 state=SSLv3 read server certificate B: certificate verify failed。

                        下载的证书文件：

                   

                        设置环境变量：

                       

                       解决办法：根据报错信息，在网上查了半天，发现是证书的问题。Ruby自己没有携带SSL证书，那就下载一个证书放置在Ruby安装目录下。之后在用户环境变量中新建一个变量，名字为SSL_CERT_FILE，值设置为证书的完整路径，最后将cmd窗口重启，之后再进行添加源的操作就成功了。

任务进度：

任务十一

任务开始时间：

2018.05.22

任务完成时间：

2018.05.24

禅道：http://task.ptteng.com/zentao/project-task-708.html