之前寫過一篇文章《EmEditor代碼片段插件介紹》，現(xiàn)在項(xiàng)目越來越多，越來越大，不再用EmEditor，而用IntelliJ IDEA。這個(gè)IDE能管理項(xiàng)目，而且也有類似的代碼片段功能——Live Template。本文主要就是關(guān)于Live Template（模版）。
自定義變量
Live Template最核心的思想是通過一個(gè)字段（Abbreviation）來展開一個(gè)模版（Template），這樣我們輸入很少字符的字段，就能輸出很多字符的模版，從而節(jié)省時(shí)間和精力。
模版中包含純文本和變量。變量是兩個(gè)美元符號(hào)$中間包含字符，比如$<variable name>$這樣的格式。舉個(gè)例子，在設(shè)定字體大小的時(shí)候，往往需要同時(shí)設(shè)置px和rem兩種單位，為了節(jié)省時(shí)間，我就創(chuàng)建了這個(gè)叫做fs的模版。
在IDEA中Ctrl+Alt+S打開設(shè)置，然后搜索Live Template，之后我們會(huì)看見很多group，比如html、css、zen css等，我這個(gè)模版是在css中觸發(fā)，所以我在css group里新建一個(gè)模版。Group只是用來管理Live Template，跟在什么環(huán)境下觸發(fā)沒關(guān)系，還可以自己建一些group比如“項(xiàng)目”
css group里新建一個(gè)fs模版
我設(shè)定的縮寫是fs，屬于css這個(gè)Group，描述是css中的font-size這個(gè)屬性。
Template text中的文本我寫的是 font-size:$v1$px;font-size:$v2$rem;
展開快捷鍵是默認(rèn)的（Tab），最后只有在CSS上下文（注意，是CSS上下文，不是CSS文件，這樣在HTML中的<style>里也是能展開這個(gè)Template的）中輸入：fs（Tab）之后，就會(huì)出現(xiàn)下面的截圖：
我隨便設(shè)置了兩個(gè)變量$v1$和$v2$，只是作為用戶輸入的一個(gè)placeholder，也可以是任何其他值。除了兩個(gè)預(yù)設(shè)變量。
出處：css森林
責(zé)任編輯：bluehearts
上一頁 下一頁 學(xué)用代碼片段 [2]
◎進(jìn)入論壇網(wǎng)頁制作、WEB標(biāo)準(zhǔn)化版塊參加討論，我還想發(fā)表評(píng)論。
|
第 1 頁 學(xué)用代碼片段 [1]
第 2 頁 
