【前端框架學習筆記】LessCSS(1):基本安裝與使用

Less 是一門 CSS 預處理語言,它擴展了 CSS 語言总棵,增加了變量鳍寂、Mixin、函數(shù)等特性情龄,使 CSS 更易維護和擴展迄汛。

Less 可以運行在 Node 或瀏覽器端。

*Less的作者把原生CSS稱為“vanilla CSS”骤视。


我認為Less最大的優(yōu)點就是減少了許多重復的css代碼鞍爱。


專門的編譯工具:http://koala-app.com/index-zh.html(可通過該工具自行創(chuàng)建less文件(后綴名為 .less),無需安裝node.js专酗。教程:http://blog.csdn.net/u011250873/article/details/45917519)


通過終端安裝(for Mac):


安裝過node.js后睹逃,打開終端,輸入以下命令進行下載&安裝:

npm install -g less

(如果有安裝國內(nèi)的cnpm的話祷肯,可以把npm改為cnpm沉填。下載安裝的速度更快。雖然不知道會有什么風險就是了)

安裝完畢后佑笋,輸入以下代碼調(diào)用less編譯器翼闹,并輸出編譯之后的 CSS 代碼到名為mystyles的css文件(沒有的話就會創(chuàng)建)

lessc styles.less > /項目路徑/mystyles.css

(Mac可以直接將項目文件夾拖到終端,終端會顯示該文件夾的具體路徑)


開始使用(也就是coding部分):


在head標簽內(nèi)依次加入以下2個標簽:

1. <link rel="stylesheet/less" type="text/css" href="styles.less" />

2. 下載less.js并解壓蒋纬,在dist找到less.js橄碾,復制粘貼到項目文件夾下,并在script標簽內(nèi)引入:

<script src="less.js" type="text/javascript"></script>




接著就是根據(jù)less的語法正常書寫代碼了颠锉。待續(xù)法牲。


--------

Ref:

http://less.bootcss.com/

http://www.imooc.com/video/4825

http://www.imooc.com/video/4827


免責聲明:http://www.reibang.com/p/cd9793098eea

最后編輯于
?著作權歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市琼掠,隨后出現(xiàn)的幾起案子拒垃,更是在濱河造成了極大的恐慌,老刑警劉巖瓷蛙,帶你破解...
    沈念sama閱讀 221,273評論 6 515
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件悼瓮,死亡現(xiàn)場離奇詭異,居然都是意外死亡艰猬,警方通過查閱死者的電腦和手機横堡,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 94,349評論 3 398
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來冠桃,“玉大人命贴,你說我怎么就攤上這事。” “怎么了胸蛛?”我有些...
    開封第一講書人閱讀 167,709評論 0 360
  • 文/不壞的土叔 我叫張陵污茵,是天一觀的道長。 經(jīng)常有香客問我葬项,道長泞当,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 59,520評論 1 296
  • 正文 為了忘掉前任民珍,我火速辦了婚禮襟士,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘嚷量。我一直安慰自己陋桂,他們只是感情好,可當我...
    茶點故事閱讀 68,515評論 6 397
  • 文/花漫 我一把揭開白布津肛。 她就那樣靜靜地躺著章喉,像睡著了一般汗贫。 火紅的嫁衣襯著肌膚如雪身坐。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 52,158評論 1 308
  • 那天落包,我揣著相機與錄音部蛇,去河邊找鬼。 笑死咐蝇,一個胖子當著我的面吹牛涯鲁,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播有序,決...
    沈念sama閱讀 40,755評論 3 421
  • 文/蒼蘭香墨 我猛地睜開眼抹腿,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了旭寿?” 一聲冷哼從身側(cè)響起警绩,我...
    開封第一講書人閱讀 39,660評論 0 276
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎盅称,沒想到半個月后肩祥,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 46,203評論 1 319
  • 正文 獨居荒郊野嶺守林人離奇死亡缩膝,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 38,287評論 3 340
  • 正文 我和宋清朗相戀三年混狠,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片疾层。...
    茶點故事閱讀 40,427評論 1 352
  • 序言:一個原本活蹦亂跳的男人離奇死亡将饺,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情俯逾,我是刑警寧澤贸桶,帶...
    沈念sama閱讀 36,122評論 5 349
  • 正文 年R本政府宣布,位于F島的核電站桌肴,受9級特大地震影響皇筛,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜坠七,卻給世界環(huán)境...
    茶點故事閱讀 41,801評論 3 333
  • 文/蒙蒙 一水醋、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧彪置,春花似錦拄踪、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,272評論 0 23
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至潘懊,卻和暖如春姚糊,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背授舟。 一陣腳步聲響...
    開封第一講書人閱讀 33,393評論 1 272
  • 我被黑心中介騙來泰國打工救恨, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人释树。 一個月前我還...
    沈念sama閱讀 48,808評論 3 376
  • 正文 我出身青樓肠槽,卻偏偏與公主長得像,于是被迫代替她去往敵國和親奢啥。 傳聞我的和親對象是個殘疾皇子秸仙,可洞房花燭夜當晚...
    茶點故事閱讀 45,440評論 2 359

推薦閱讀更多精彩內(nèi)容

  • 前些日子從@張鑫旭微博處得一份推薦(Front-end-tutorial),號稱最全的資源教程-前端涉及的所有知識...
    谷子多閱讀 4,203評論 0 44
  • 需要記住的實在太多了桩盲,書籍寂纪、手冊、指南上都是需要記憶的正驻,尤其是其中很多對個人而言是相當陌生的時候弊攘,記憶能力卻很是有...
    五點砍柴閱讀 223評論 0 0
  • 為什么需要刻意練習:練習的目的是將動作變得熟練,自信姑曙。 例如:我們打籃球襟交、打字、說話伤靠。都是需要刻意練習去將我們的動...
    邱凱閱讀 398評論 0 0
  • 床上捣域,背靠填充木板啼染,再后是簡易窗簾。左臂倚枕焕梅,右手持風迹鹅。窗外有雨,四周漆黑贞言。 許是天氣的緣故斜棚,近日沖動、易怒该窗。新...
    是春山閱讀 221評論 0 0
  • 為了讓歸檔的文件更好地發(fā)揮作用弟蚀,在歸檔的目錄上,應該包括復盤的時間酗失、事件义钉、參與人員、得出的規(guī)律等基本信息规肴。如果進一...
    再見彼岸花閱讀 133評論 0 0