类型检查功能（Type Checking Functions）

优质

小牛编辑

137浏览

2023-12-01

描述 (Description)

您可以使用类型检查内置函数来确定匹配mixin的值类型。为此，您可以使用is函数。以下是可用功能列表 -

iscolor
isnumber
isstring
iskeyword
isurl

上面列出的功能是基本类型检查。您可以使用以下功能检查值是否在特定单元中 -

ispixel
ispercentage
isem
isunit

例子 (Example)

以下示例演示了在LESS文件中使用类型检查功能 -

<!doctype html>
   <head>
      <title>Type Checking Functions</title>
      <link rel = "stylesheet" href = "style.css" type = "text/css" />
   </head>
   <body>
      <h2>Example of Type Checking Functions</h2>
      <p class = "myclass">Hello World!!!Welcome to xnip...</p>
   </body>
</html>

接下来，创建style.less文件。

style.less

.mixin (@a; @b: red) when (iscolor(@b)){
   color:blue;
}
.mixin (@a) {
   font-size: @a;
}
.myclass { .mixin(20px) }

您可以使用以下命令将style.less编译为style.css -

lessc style.less style.css

现在执行上面的命令; 它将使用以下代码自动创建style.css文件 -

style.css

.myclass {
   color: blue;
   font-size: 20px;
}

输出 (Output)

请按照以下步骤查看上述代码的工作原理 -

将以上html代码保存在type_checking_functions.html文件中。
在浏览器中打开此HTML文件，将显示以下输出。