css预处理技术有哪些（Less预处理——初识Less）
导读：系列文章目录 一、Less 简介...
系列文章目录
一 、Less 简介
Less 是一门 CSS 预处理语言 ，它扩充了 CSS 语言 ，增加了诸如 变量 、混合（mixin） 、函数 等功能 ，让 CSS 更易维护 、方便制作主题 、扩充 。
Less 可以运行在 Node 或浏览器端 。
Less 可以让我们 用更少的代码做更多的事情 。
二 、安装 Easy LESS
Easy LESS：用于实现编写 Less 文件后 自动生成 CSS 或者 WXSS 文件
三 、第一个小例子
index.html 文件
注意：把 css 文件引入进来 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <link rel="stylesheet" href="./index.css"> </head> <body> <div id="container"> Hello Less! </div> </body> </html>index.less 文件
@xxx：定义公共的样式 使用的时候直接 @xxx 即可 @color: skyblue; @bgColor: red; @width: 100px; @height: 100px; #container { color: @color; background-color: @bgColor; width: @width; height: @height; }index.css 文件
自动转义后的 css 文件如下 #container { color: skyblue; background-color: red; width: 100px; height: 100px; }这里是 前端杂货铺 ，期待您的 三连 + 关注
声明：本站所有文章 ，如无特殊说明或标注 ，均为本站原创发布 。任何个人或组织 ，在未征得本站同意时 ，禁止复制 、盗用 、采集 、发布本站内容到任何网站 、书籍等各类媒体平台 。如若本站内容侵犯了原著者的合法权益 ，可联系我们进行处理 。
创心域SEO版权声明：以上内容作者已申请原创保护，未经允许不得转载，侵权必究！授权事宜、对本内容有异议或投诉，敬请联系网站管理员，我们将尽快回复您，谢谢合作！