less相关知识点

less是一门css预处理语言,文件后缀名为.less,能减少css文件编写的代码量

• 官网
  • http://lesscss.cn/#using-less
• 安装
  • 使用npm install -g less 全局安装less
  • 在node.js and NPM中激活
  • 在file watchers中打开less监听
  • webstorm建立的less文件将会被自动的预编译
• 使用方法
  • 注释
    • "//"表示的注释是不会被预编译成css的
    • "/**/"表示的注释是会被预编译的
  • 变量
    • 通过关键词@+变量名来创建变量,变量只能在less文件中使用,而不会被编译
    • 变量能在不同的地方调用相同的css值
    • 在给属性赋值时,变量可以进行基本的数学计算
  • 函数
    • 创建:"."+方法样式名+(@变量名:添加默认值){};
    • 调用:"."+样式名+(值),没有值的情况下添加的是默认值
    • 不同样式之间,变量互不影响
    • less函数不会被预编译,只能在less文件中被调用
  • 混合嵌套(函数写法)
    • 类名可以当成函数使用,也就是即能被预编译成,也能在less文件中当成函数被其他的样式调用
  • 子代选择器
    • 在父类元素对应的less样式中,可以直接写子类的样式,支持多重子类的样式编写,最后编译成子代选择器的css样式