头闻号

上海佑孚贸易有限公司

综合性公司|其他聚合物|室内涂料|涂料、油漆|特种涂料

首页 > 新闻中心 > 科技常识:Less导入选项
科技常识:Less导入选项
发布时间:2024-11-27 06:36:12        浏览次数:8        返回列表

今天小编跟大家讲解下有关Less导入选项 ,相信小伙伴们对这个话题应该有所关注吧,小编也收集到了有关Less导入选项 的相关资料,希望小伙伴们看了有所帮助。

Less [email protected] css规则的几个扩展,以提供更多的灵活性来处理外部文件。

语法:@import (keyword)"filename";

以下是导入指令的相关详情:

reference,使用较少的文件但不输出。inline,在输出中包含源文件,但不对其进行处理。less,无论文件扩展名为什么,都将其视为less文件。css,无论文件扩展名为什么,都将其视为css文件。once,仅包含一次文件(这是默认行为)。multiple,多次包含文件。optional,找不到文件时继续编译。

参考

[email protected](reference)导入外部文件,但除非被引用,否则不将导入的样式添加到编译的输出中。

reference 根据所使用的方法(混合还是扩展),会产生不同的结果:

mixin:当reference样式用作隐式mixin时,它的规则将被混合,标记为 “not reference”,并照常显示在被引用的位置。extend:扩展选择器时,仅将新选择器标记为未引用,并将其拉入引用 import 语句的位置。

Inline

[email protected] (inline)包括外部文件,但不能对其进行处理。

Less

[email protected] (less)治疗导入的文件一样都不能少,无论文件扩展名。

@import (less)"main.css";

css

[email protected] (css)治疗导入的文件作为常规css,无论文件扩展名,也就意味着import语句将保持原样。

@import (css)"main.less";// [email protected]"main.less";

Once

@import语句的默认行为,也就意味着该文件仅导入一次,该文件的后续导入语句将被忽略。

@import (once)"main.less";// [email protected] (once)"main.less";

Multiple

[email protected] (multiple)允许使用相同的名称导入的多个文件,这是一次相反的行为。

// file: main.lessdiv { color: green;}// file: [email protected] (multiple)"main.less";@import (multiple)"main.less"; // 输出结果div { color: green;}div { color: green;}

Optional

[email protected] (optional)仅在文件存在时才允许导入,如果没有optional关键字Less,则在导入找不到的文件时会引发FileError并停止编译。

来源:爱蒂网