第四个五天总结--冯国光

五周总结

--一晃过了四周过去了，前几周下来都觉得时间过得好慢，这次不知怎么了突然感觉时间过得好快，突然有种舍不得的感觉，可能是柳茹的人和事吧，才会让人如此吧。

Less语言

   Less 是一门 CSS 预处理语言，它扩展了 CSS 语言，增加了变量、Mixin、函数等特性，使 CSS 更易维护和扩展。

-Less的安装与配置

   $ npm install -g less   //安装Less

   $ lessc styles.less     //调用编译器

##将编译.less生成的.css文件存放到指定目录（默认下是存放到stdout下）

$ lessc --clean-css styles.less styles.min.css

调用编译器节点,代码用法

var less = require('less');
     less.render('.class { width: (1 + 1) }', function (e, output) {
     console.log(output.css);
    });
  //输出

.class { width: 2; }

配置编译器

var less = require('less');

less.render('.class { width: (1 + 1) }',
    {
      paths: ['.', './lib'],  // 为@import指令定搜索路径
      filename: 'style.less', // 指定一个文件名，为更好的错误信息
      compress: true          // 贬低CSS输出
    },
    function (e, output) {
       console.log(output.css);
    });
-客户端是最简单的方法开始和发展较低,但在生产中,当性能和可靠性是非常重要的,我们建议使用节点预编译。js或第三方工具之一。
开始,我的链接。少了样式表的rel属性设置为“样式表/少”:

-接下来,加入less.js和包含在标记的元素的页面:

<script src="less.js" type="text/javascript"></script>
-选项是由设置
```<!-- set options before less.js script -->
<script>
  less = {
    env: "development",
    async: false,
    fileAsync: false,
    poll: 1000,
    functions: {},
    dumpLineNumbers: "comments",
    relativeUrls: false,
    rootpath: ":/a.com/"
  };
</script>
<script src="less.js"></script>

-或简洁他们可以作为属性设置脚本和链接标签(需要JSON。解析浏览器支持或polyfill)。

  <script src="less.js" data-poll="1000" data-relative-urls="false"></script>

  <link data-dump-line-numbers="all" data-global-vars='{ myvar: "#ddffee", mystr:

 ""quoted"" }' rel="stylesheet/less" type="text/css" href="less/styles.less">