前端工程師必備神器, 縮短你爆肝的時間! 本篇為教學文第三篇-複製元素與設定流水編號
再假設我們想要在一個 .news 中放置 5 個 .block，然後每個 .block 中都有 1 個 h2 標題及 3 個 p 段落，每個 p 段落中又放置兩張圖片，則輸入「.news>(.block>h2+(p>img*2)*2)*5」
如果要在這些流水編號前面加個「零」，例如 01、001，則補上只要補上相對數量的 $ 即可。像是 01 就是 $$、001 就是 $$$。承上例，我們輸入「li.list-$$*5」以及「li.list-$$$*5」
Emmet 預設的編號是由小到大，若是希望編號由大到小，那麼就是在 @ 後面補上一個 - 負號 (就算是沒要設定起始值也是要多補 @)。例如我們要輸入 5 個 li 標籤，編號由大到小，就輸入「li.list-$@-*5」 我們要設定起始數字為 5 ，就輸入「li.list-$@-5*5」。
延伸閱讀：
前端工程師外掛神器Emmet使用教學(一)快速產生標籤名稱
前端工程師外掛神器Emmet使用教學(二)階層與群組
前端工程師外掛神器Emmet使用教學(四)顯示文字與自訂屬性
暑假快到了！與其讓兒子盲目拚學測，我寧可讓他先選擇人生方向~
單一技能已被淘汰 讓Java課程使你充實自我 還能媒合高薪職缺
厭世代正風行?來上Java課程可以幫你扭轉困境!
人人都能是工程師！台灣 IT 培訓中心推「找到工作再付學費」專案，要試試嗎？
 |
| 前端工程師必備神器, 縮短你爆肝的時間! 本篇為教學文第三篇-複製元素與設定流水編號 |
複製元素
當前端工程師要產生 ol 或是 ul 清單標籤時，都會包含一拖拉庫的 li 元素。如果要一個一個慢慢手動輸入的話，就算是使用 Emmet 的「+」快捷輸入法，還是會花去不少時間。還好 Emmet 有複製的快捷輸入法：「*」。用法是：如果想要一次產生 5 個相同的元素的話，就在原宿後方輸入「*5」。由此類推，產生 7 個就是「*7」。假使我們今天要建立一個 ul 清單標籤，包含 5 個 li 元素，語法就可以這樣寫「ul>li*5」之後再按 ctrl+E 即可。編號
有時候前端工程師在輸入 HTML 的li 標籤時，會給這些 li 一個共用的 .className 以及流水編號。若搭配 Emmet 的「$」時，就可以快速的產生。例如，今天我們要輸入五個 li 標籤，標籤的 class name 分別為 list-1、list-2、list-3、list-4、list-5，則輸入「li.list-$*5」設定起始編號
$的用法，預設數字是從 1 開始累加。有時前端工程師會需要指定起始數字，這時則在 HTML的$ 後面多補上一個 @ 並加上指定的起始數字，承上例，我們要設定起始數字為 5 就輸入「li.list-$$@5*5」前端工程師外掛神器Emmet使用教學(一)快速產生標籤名稱
前端工程師外掛神器Emmet使用教學(二)階層與群組
前端工程師外掛神器Emmet使用教學(四)顯示文字與自訂屬性
暑假快到了！與其讓兒子盲目拚學測，我寧可讓他先選擇人生方向~
單一技能已被淘汰 讓Java課程使你充實自我 還能媒合高薪職缺
厭世代正風行?來上Java課程可以幫你扭轉困境!
人人都能是工程師！台灣 IT 培訓中心推「找到工作再付學費」專案，要試試嗎？