前端工程師必備神器, 縮短你爆肝的時間! 本篇為教學文第四篇-快速設定顯示文字與自訂屬性值
如果想要產生元素中的文字時，可以透過加上 {} 大括號並在其中寫上文字，如我們想要輸入名為「標題」的 h1 標籤、名為「副標題」的 h2 標籤，以及內容為 「內文」 的 p 標籤，就輸入「h1{標題}+h2{副標題}+p{內文}」後按下 Ctrl+E。
}
如果想要產生元素中的屬性時，可以透過加上 [] 中括號並在其中寫上屬性與值的內容，值需要用雙引號或是單引號包起來。例如我們今天要產生一個連結到網站「https://www.tedu.tw」的 a 元素，就在HTML輸入「a[href="https://www.tedu.tw"]」後按下 Ctrl+E。
如果想要增加顯示的文字，就可以在 [] 中括號後方加上{} 大括號並在其中寫上文字即可。延續上面的例子，我們可加上「達內教育」文字，就輸入「[a[href="https://www.tedu.tw"]{達內教育}」後按下 Ctrl+E。
若想要多增加一些屬性值，只要在同一個 [] 中括號中，將每個屬性值用空格隔開就可以了。如在上個例子中，想要設定網站在新分頁開啟，我們就輸入輸入「[a[href="https://www.tedu.tw" target="blank"]{達內教育}」後按下 Ctrl+E。
延伸閱讀：
前端工程師外掛神器Emmet使用教學(一)快速產生標籤名稱
前端工程師外掛神器Emmet使用教學(二)階層與群組
前端工程師外掛神器Emmet使用教學(三)元素與流水編號
暑假快到了！與其讓兒子盲目拚學測，我寧可讓他先選擇人生方向~
單一技能已被淘汰 讓Java課程使你充實自我 還能媒合高薪職缺
厭世代正風行?來上Java課程可以幫你扭轉困境!
人人都能是工程師！台灣 IT 培訓中心推「找到工作再付學費」專案，要試試嗎？
 |
| 前端工程師必備神器, 縮短你爆肝的時間! 本篇為教學文第四篇-快速設定顯示文字與自訂屬性值 |
顯示文字
使用 Emmet 能讓前端工程師快速展開各種 HTML 元素，但如果能在撰寫的時候就能產生內文，不需等到元素展開後才補上內文就更棒了！這個功能 Emmet 也有！不塊是前端工程師的省時神器！如果想要產生元素中的文字時，可以透過加上 {} 大括號並在其中寫上文字，如我們想要輸入名為「標題」的 h1 標籤、名為「副標題」的 h2 標籤，以及內容為 「內文」 的 p 標籤，就輸入「h1{標題}+h2{副標題}+p{內文}」後按下 Ctrl+E。
自訂屬性值
Emmet 除了可以讓前端工程師快速展開標籤與文字之外，對於像是 a href、img 等需要設定屬性的標籤，也可以在寫的時候就產生。如果想要產生元素中的屬性時，可以透過加上 [] 中括號並在其中寫上屬性與值的內容，值需要用雙引號或是單引號包起來。例如我們今天要產生一個連結到網站「https://www.tedu.tw」的 a 元素，就在HTML輸入「a[href="https://www.tedu.tw"]」後按下 Ctrl+E。
前端工程師外掛神器Emmet使用教學(一)快速產生標籤名稱
前端工程師外掛神器Emmet使用教學(二)階層與群組
前端工程師外掛神器Emmet使用教學(三)元素與流水編號
暑假快到了！與其讓兒子盲目拚學測，我寧可讓他先選擇人生方向~
單一技能已被淘汰 讓Java課程使你充實自我 還能媒合高薪職缺
厭世代正風行?來上Java課程可以幫你扭轉困境!
人人都能是工程師！台灣 IT 培訓中心推「找到工作再付學費」專案，要試試嗎？