js中less常用的方法小結

發布時間：2020-10-19 15:59:01 來源：腳本之家閱讀：156 作者：jingxian 欄目：web開發

1、color 解析顏色把代表顏色的字符串轉換為顏色值

@c:'#000'
.box{
  background:color(@c)
}

2、data-uri 把我們需要使用的素材圖片轉化成BASE64編碼，項目中尤其是移動端的項目，節省了圖片的加載時間，是圖片優化的一個手段；LESS對于大圖片是不能轉碼的，我們可以使用BASE64工具轉碼（tool.css-js.com）

項目中慎用，當你在移動端項目中有一些大圖實在沒有辦法處理了的情況下在使用BASE64。

@c:'#000'
@url:'../img/banner';
.box{
  background:data-uri('@{url}/banner1.jpg');
}

3、unit（去除單位和添加單位）

@w100:100px
.box{
  width:unit(unit(@w100)-50,px)
}

4、length（長度） extract（提取）

@color:#000,#fff,#ccc,#eee;
.box{
  z-index:length(@color);
  background:extract(@color,length(@color));
}

5、ceil 、floor、percentage、round、sqrt...mod（取余數（4,2））min max等數學方法

6、saturate（@value，20%）增加飽和度 desaturate（@value，20%）增加飽和度 lighten 增加亮度 darken降低亮度 fadein 增加透明度 fadeout 降低透明度 fade設置透明度 greyscale 完全移除飽和度變為灰度

以上這篇js中less常用的方法小結就是小編分享給大家的全部內容了，希望能給大家一個參考，也希望大家多多支持億速云。

向AI問一下細節

中文字幕av专区_日韩电影在线播放_精品国产精品久久一区免费式_av在线免费观看网站