前言：GitHub：https://github.com/Ewall1106/mall
一、什么是less？
less是什么自然不用多言，乃一個css預編譯器，可以擴展css語言，添加功能如如允許變量(variables),混合(mixins),函數(functions) 和許多其他的技術，讓你的Css更具維護性，主題性，擴展性。愛掏網 - it200.com
官網：http://lesscss.org/usage/
二、項目中使用less
1、less的安裝
打開命名行，安裝less和less-loader就可以了：
$ cnpm install less less-loader --save-dev
install
2、使用less
怎么使用，大概就這樣，不需要引入什么的，直接用，定義下lang屬性就行
我們新建一個home.vue頁面
home.vue
三、less與公共變量
一般在我們項目中，需要把所有統一的色調、樣式提出出來作為公共變量使用，比如這里，假設紅色是我們項目的基調色，很多頁面都要用到，所以我們定義一下這個背景色。愛掏網 - it200.com
1、我們在styles下面新建一個variables.less文件，用于存放less公共變量，然后定義一下全局背景色
variables
這是定義less變量的語法，還有很多less的語法，大家可以去官網看看。愛掏網 - it200.com
2、項目中引入
項目中引入
這里需要踩的坑我都注釋了，看注釋就行。愛掏網 - it200.com
3、ok，我們去瀏覽器中看看效果
瀏覽器
那么，以后再項目中就可以把所有的頁面公共的變量抽離出來使用了。愛掏網 - it200.com
參考學習
http://lesscss.org/usage/
聲明：所有內容來自互聯網搜索結果,不保證100%準確性,僅供參考。如若本站內容侵犯了原著者的合法權益，可聯系我們進行處理。