Less 其他函数

  • 定义和使用

    其他函数由一组不同类型的功能组成。
    下表列出了所有类型的misc函数-
    序号 功能与说明 示例
    1
    color
    它是代表颜色的字符串。
    color:(#fe2700)
    编译生成:
    color: #fe2700;
    2
    image-size
    它用于检查文件中图像的尺寸。
    image-size:image-size("startup.jpg");
    编译生成图片的大小尺寸:
    image-size: 1200px 800px;
    3
    image-width
    它检查文件中图像的宽度。
    width:image-width("startup.jpg");
    编译生成图片的宽度尺寸:
    width: 1200px;
    4
    image-height
    它检查文件中图像的高度。
    height:image-height("startup.jpg");
    编译生成图片的宽度尺寸:
    height:800px;
    5
    convert
    数字从一个单位转换为另一单位。
    meter:convert(10cm, mm);
    编译生成:
    meter: 100mm;
    6
    data-uri
    数据uri是统一资源标识符(URI)架构,可在网页上内联资源
    background: data-uri('startup.jpg');
    编译生成:
    background: url('startup.jpg');
    7
    default
    仅当默认值在保护条件内可用且与任何其他mixin不匹配时,它才返回true。
    .mixin(@a) when (default()) {d: @a}
    div{.mixin(12);}
    编译生成:
    div {d: 12;}
    8
    unit
    默认函数仅在保护条件内可用且与任何其他 mixin 不匹配时才返回 true
    font-size:unit(30, px);
    编译生成:
    font-size: 30px;
    9
    get-unit
    get-unit 函数返回其单位,其中参数以数字和单位表示。
    font-size:get-unit(30px);
    编译生成:
    font-size: px;
    10
    svg-gradient
    svg-gradient 是一种颜色到另一种颜色的过渡。 它可以为同一元素添加许多颜色。
    .style { @style: orange, green 30%, #LESS520;background-image: svg-gradient(ellipse, @style);}
    编译会生成data:image/svg+xml,一系列的乱码字符:
    .style {background-image: url('data:image/svg+xml,%3C%3Fxml%xxxxxxxxx');}