less

Posted zifieyu666

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了less相关的知识,希望对你有一定的参考价值。

  • 编译器koala
  • 注释
    • /**/
    • //
  • 变量:
    • @variable_width:500px;
  • 混合(mixin)
    • .border{
          border:1px solid red;
      }
      .box{
          .border;
          width:150px;
          height:150px;
          background: blue;
      }
      .border_02(@border_width){
          border:solid #fff @border_width;
      }
      .test_hunhe{
          .border_02(30px);
      }
      .border_03(@border_width:10px){
          border:solid #fff @border_width;
      }
      .test_hunhe_03{
          .border_03();//.border_03(50px);
      }
      .border_radius(@border_radius){
          -webkit-border-radius:@border_radius;
          -moz-border-radius:@border_radius;
          border-radius:@border_radius;
      }
      
      .radius_test{
          .border_radius(20px);
          width:40px;
          height:40px;
          background:green;
      }
  • 匹配模式
    • 相当于js中的if

以上是关于less的主要内容,如果未能解决你的问题,请参考以下文章

使用bootstrap的原因是啥

less快速入门

less快速入门

十分钟入门less(翻译自:Learn lESS in 10 Minutes(or less))

免费下载全套最新014Less视频教程+教学资料+学习课件+源代码+软件开发工具

less与sass书写--敲代码的伙伴koala(考拉)