Less 提供了 CSS @import CSS 规定的几个扩大,以提供更多的灵活性来解决内部文件。
语法:@import (keyword) "filename";
以下是导入指令的相干详情:
reference
,应用较少的文件但不输入。inline
,在输入中蕴含源文件,但不对其进行解决。less
,无论文件扩展名为什么,都将其视为 less 文件。css
,无论文件扩展名为什么,都将其视为 CSS 文件。once
,仅蕴含一次文件(这是默认行为)。multiple
,屡次蕴含文件。optional
,找不到文件时持续编译。
参考
应用 @import(reference)
导入内部文件,但除非被援用,否则不将导入的款式增加到编译的输入中。
reference 依据所应用的办法(混合还是扩大),会产生不同的后果:
mixin
:当 reference 款式用作隐式 mixin 时,它的规定将被混合,标记为“not reference”,并照常显示在被援用的地位。extend
:扩大选择器时,仅将新选择器标记为未援用,并将其拉入援用 import 语句的地位。
Inline
应用 @import (inline) 包含内部文件,但不能对其进行解决。
Less
应用 @import (less)
医治导入的文件一样都不能少,无论文件扩展名。
@import (less) "main.css";
CSS
应用 @import (css)
医治导入的文件作为惯例 CSS,无论文件扩展名,也就意味着 import 语句将放弃原样。
@import (css) "main.less";
// 输入
@import "main.less";
Once
@import
语句的默认行为,也就意味着该文件仅导入一次,该文件的后续导入语句将被疏忽。
@import (once) "main.less";
// 此语句将被疏忽
@import (once) "main.less";
Multiple
应用 @import (multiple)
容许应用雷同的名称导入的多个文件,这是一次相同的行为。
// file: main.less
div {color: green;}
// file: index.less
@import (multiple) "main.less";
@import (multiple) "main.less";
// 输入后果
div {color: green;}
div {color: green;}