欢迎来到资源库(www.zyku.net)

Sublime

当前位置:首页 > 软件教程 > Sublime > less2Css

Sublime Text 3的Less2Css插件介绍与安装

时间:2017-03-15|栏目:Sublime|点击:|我要投稿

在介绍Less2Css之前我们先安装一个less的语法高亮,用LESS的同学都知道,sublime没有支持less的语法高亮,所以这个插件可以帮上我们,可以直接安装ctrl+shift+p>install Package搜索less按Enter就可以了,或者到这里下载,安装成功后,重启sublime

下面安装Less2Css,跟上面一样ctrl+shift+p>install Package搜索Less2Css按Enter就可以安装了,Less2Css插件依赖lessc这个工具,在windows下可以下载或者用git cloneless.js-windows到本地目录。然后把目录地址加入到环境变量PATH的中,如D:\less.js-windows-master:

Sublime Text 3的Less2Css插件介绍与安装

设置好之后,通过快捷键 Windows徽标键+R键 调出运行窗口,输入cmd,在命令行中输入lessc,如果有如下提示则表示设置成功:

  C:\Users\Fdream>lessc
  lessc.wsf: no input files
  Usage:
  Single file: cscript //nologo lessc.wsf input.less [output.css] [-compre
  Directory: cscript //nologo lessc.wsf inputdir outputdir [-compress]

(上面的这个步骤有时候cmd时会出现错误,打印不出来,可以略过)

这时关掉Sublime Text 3再重新打开就可以在Sublime Text 3中打开或者新建一个less文件,按下Ctrl+S保存,此时应该会在less文件的相同目录下生成同名的css文件。

来段代码试试吧:

  @width:300px;
  @fonts:12px bold 'Source Code Pro', Menlo, Consolas, Monaco, monospace;
  .header{
  color:#5c5c5c;
  .title{
  font:@fonts;
  width:@width;
  }
  .content{
  width:@width;
  height:300px;
  }
  }
  .footer{
  font:@fonts;
  width:@width + 100px;
  }

原文链接:http://www.daqianduan.com/6033.html

(资源库 www.zyku.net)

上一篇:Sublime Text 3 换行无法自动缩进的解决方法

栏    目:Sublime

下一篇:sublime text2/3中默认预览浏览器快捷键的方法

本文标题:Sublime Text 3的Less2Css插件介绍与安装

本文地址:https://www.zyku.net/sublime/1234.html

关于我们 | 版权申明 | 寻求合作 |

重要申明:本站所有的文章、图片、评论等内容,均由网友发表或上传并维护或收集自网络,仅供个人学习交流使用,版权归原作者所有。

如有侵犯您的版权,请与我们联系,我们将在24小时内进行处理、任何非本站因素导致的法律后果,本站均不负任何责任。

联系QQ:95148658 | 邮箱:mb8#qq.com(#换成@)

苏ICP备2020066115号-1

本网站由提供CDN加速/云存储服务