『签 到』
搜索
本版
文章
帖子
群组
用户
游客您好
已有账号?
登陆账号
注册后更精彩
立即注册
第三方账号登陆
QQ登陆
微信登陆
微博登陆
充值积分
签到
首页
首页
前端
后端
数据库
移动端
源码
软件
模板
插件
随书CD
工具
视频
技巧
悬赏
手册
积分商城
论坛
BBS
充值
导读
Guide
浏览器
HTML
less开发
Bootstrap
CSS样式
jquery
Javascrip
WebApp
Ajax资料
json资料
Node.js
正则表达式
前端工具
其他代码
PHP开发
ASP.NET开发
JAVA开发
C#开发
GO开发
JSP开发
discuz开发
Servlet
SQL Server数据库
MySQL数据库
Oracle数据库
DB2数据库
PostgreSQL数据库
Sybase数据库
微信小程序
微信公众号
Android开发
微擎/微赞
PHP源码
JSP源码
.NET源码
游戏源码
功能源码
APP源码
其他源码
Adobe系列
安卓软件
编程软件
设计软件
办公软件
音频视频
系统软件
游戏下载
其他破解
Bootstrap模板
织梦模板
PPT模版
wordpress模板
帝国cms模板
手机模板
网页模板
其他模板
vscode插件
notepad
Myeclipse插件
bootstrap工具集
ICO图标制作
在线美图秀秀
文章伪原创
五合一收款码
CSS格式化
微信编辑器
图书中心
考试中心
iclone
php
轻松一刻
wordpress
PS技巧
伪原创
资源采集
建站运营
SEO优化
浏览器
质量管理
机械制图
加工工艺
综合技巧
问答悬赏
站长福利
手册下载
在线充值
购买vip
兑换元宝
卡券充值
前端速报
Lv.7
版主
1683号会员,
82活跃度,
2020/05/16 加入学习
14
发帖
14
主题
0
关注
0
粉丝
这个人很懒,什么也没有留下。
发私信
收听TA
最新推荐
更多
软件爆破手
:
超强右键转格式开源免费
2021-01-08
112
0
软件爆破手
:
每年必备免费抢票软件12306订票助手NET
2021-01-01
135
0
风起云甬
:
分享一个Jetbrains Patch and new Key
2021-01-01
223
0
风起云甬
:
经典bootstrap实现弹窗和拖动效果
2020-12-31
205
0
软件爆破手
:
Kutools for Word v10.0 专业的Word插件工
2020-12-27
132
0
软件爆破手
:
matlab2016免安装版
2020-12-24
147
0
软件爆破手
:
威力导演旗舰版19.0.23便携版
2020-12-24
167
0
风起云甬
:
关于百度OCR截图识字 代码存档
2020-12-20
238
0
风起云甬
:
约瑟夫环 递归解法
2020-12-20
239
0
风起云甬
:
TabIndex 属性:Tabindex="-1" 与Tabindex=
2020-12-18
255
0
风起云甬
:
bootstrap使用Modal,关闭弹框遗留遮罩层
2020-12-17
234
0
软件爆破手
:
WordPress关注获取密码
2020-12-17
128
0
软件爆破手
:
关于Discuz! X3.3 X3.2移除dz云平台
2020-12-14
271
0
风起云甬
:
优秀视频网站地址
2020-12-13
245
0
软件爆破手
:
超好用音乐播放器Foobox6.1.6.2
2020-12-09
180
0
软件爆破手
:
官方正式版Microsoft .NET Runtime v5.0.1
2020-12-09
161
0
软件爆破手
:
Microsoft Visual C++ 2015-2019 Redistrib
2020-12-09
162
0
软件爆破手
:
数据恢复中文绿色网络版(R-Studio Network)
2020-12-07
163
0
软件爆破手
:
HiBit Uninstaller v2.5.70 中文绿色单文件
2020-12-07
168
0
软件爆破手
:
网络拓扑图绘制工具FPinger5.0.1
2020-12-05
140
0
返回列表
[less开发]
less的四种使用方法介绍
[复制链接]
前端速报
发表于 2020-5-18 17:36:09
|
显示全部楼层
|
阅读模式
less的四种使用方法介绍
1、直接引入less.js
使用步骤:
1、到less官网,下载less文件
2、在编译器中新建一个less文件,引入到我们的html页面中(注意下面的和css的引入方式稍微有些不同哦,看rel)
3、引入我们下载的less文件
然后就可以使用了
好处:能获取到客户端的数据,从而进一步计算
坏处:在客户端解析less,造成性能浪费,不利于维护(不推荐)
2、koala编译器
使用步骤:
1、在koala-app.com中下载软件就可以
2、打开koala软件,然后将我们的less所在的文件夹拖拽到软件中
3、koala会自动读到less文件,然后点击less文件,单击右键,选择输出的路径以及编译后的css文件名,之后在右侧菜单栏点击执行编译即可(上面的选项,只要把自动编译勾选即可,输出方式可以选择normal也可以选择compress(压缩)的方式,搜可以,其他的不需要管)
4、编译成功,会在我们指定的文件夹中生成一个css文件,之后将这个css文件引入我们的html文件中即可
(推荐小白使用)
使用步骤:
1、需要下载安装node环境,检测安装成功的方法在命令行输入npm,如果安装成功就会有一些信息,错了,就会报错
简单说一下打开命令行的方法(windows系统)win+R――输入cmd――enter――进入命令行――输入npm――按enter键
4、在编译器中实时编译(配置稍微麻烦,但本人比较喜欢这一种)
这种方法也需要安装node,之后用npm安装less,和上面的安装方法一样
然后打开我们的编译器(以webstorm为例,其他的也都大同小异)
点击文件(File)――找到Tools――File Watchers――找到右侧有个加号(+)――单击加号找到less选择less――弹出一个菜单,找到Program:后面让选择程序,找到我们安装的less程序
注:找到程序的方法:先找到C盘――users――用户(也可能是你的名字,自己起的)――AppData(如果这里找不到的话,可以找到这个菜单上面几个图标中的最后一个(Show
Hidden Files and Directiories)即可找到)――Roaming――npm――lessc.cmd,选中之后,其它的不用管直接点击ok,然后再点ok即可
之后我们再去建一个less文件,它就会自动生成一个同名的css文件,把这个css文件引入我们的HTML文件中即可
我比较喜欢第四种,在实际的项目中,比较推荐的也是最后两种方法,对于初学者可能稍微麻烦,但熟悉之后就特别简单了• 本内容来源互联网,如涉及版权问题请及时联系站长 • 为防止代码解析,除代码框内<>为正常,其余请重新替换<>尖括号
回复
百度
360
搜狗
搜搜
有道
必应
即刻
使用道具
举报
提升卡
置顶卡
喧嚣卡
变色卡
千斤顶
照妖镜
发布主题
返回列表
返回顶部
发布资源
快速回复
站点服务大厅
搜索
官方群
关注微信
微信扫一扫关注本站公众号
QR Code
手机扫描二维码快速访问本帖
个人中心
个人中心
登录或注册
返回顶部
返回列表