Less Sass Scss

Kooboo 支持 Less, Sass 和 Scss语法.  Less 是默认支持。 Sass 和 Scss 包含在额外的下载包中。 

使用方法如下:  

用文件扩展名

当你在创建一个新的样式时, 你可以选择样式的扩展名。 如果有安装相应的引擎, 护展名会出现在下拉框中。 

选择相应的扩展名并使用对应的语法写你的样式。 

用标签属性

或是你在目标对象的DOM源代码中使用HTML的标签属性, 如下图。 

<div class="jumbotron">
    <h2>Welcome!</h2>
</div>

<style engine="less">
    @hello: #dd4433;
    @world: #66bb33; 
    .hello {
      color: @hello;
    } 
    .world {
      color: @world;
    }
</style>

输出结果:

<div class="jumbotron">
    <h2>Welcome!</h2>
</div>

<style engine="less">.hello {
  color: #dd4433;
}
.world {
  color: #66bb33;
}
</style>