Less简明教程
1.2 Less 原理
阅读(

Less 基础

认识 Less

Less 原理

Less 包含一套自定义的语法及一个解析器,用户根据这些语法定义自己的样式规则,这些规则最终会通过解析器,编译生成对应的 CSS 文件。

Less 并没有裁剪 CSS 原有的特性,更不是用来取代 CSS 的,而是在现有 CSS 语法的基础上,为 CSS 加入程序式语言的特性。先看一个简单的例子,Less 代码如下:

@color: #4d926f;
header {
  color: @color;
}
h2 {
  color: @color;
}

上面的例子定义了一个变量 @color,然后在选择器 header 和 h2 中使用它。编译后的CSS代码为:

header {
  color: #4d926f;
}
h2 {
  color: #4d926f;
}

从上面的例子可知,Less并没有改变CSS的语法。因此,学习 Less 非常容易,只要你了解 CSS 基础,就可以很容易上手。

关于作者

歪脖先生,十五年以上软件开发经验,酷爱Web开发,精通 HTML、CSS、JavaScript、jQuery、JSON、Python、Less、Bootstrap等,著有《HTML宝典》、《揭秘CSS》、《Less简明教程》、《JSON教程》、《Bootstrap2用户指南》、《Bootstrap3实用教程》,并全部在 GitHub 上开源。

如果本教程对您帮助很大,请随意打赏。您的支持,将鼓励我写出更好的教程!

← 键盘方向键翻页 →
返回顶部 手机访问 关注微信 返回底部

扫码访问歪脖网

随时随地,想看就看

关注歪脖网微信

分享 web 知识、交流 web 经验