《Sublime Text》自訂Emmet常用的網頁標籤語法並快速輸出

梅問題-《Sublime Text》自訂Emmet常用的網頁標籤語法並快速輸出
  之前有同學問到Sublime Text,能不能像Dreamweaver一樣,內建就有基本的網頁範本,當開啟新檔時,立即就可建立一個空的網頁樣版來,確實這是Dreamweaver好用的地方,於是梅干就去請教了好友男丁,看有沒有相關的替代方案,沒想到只要安裝Emmet後,就可快速的產生HTML的網頁架構出來,除此之外還可自行建立,自已常用的網頁標籤語法,且只要輸入短碼,再按Tab鍵立即就可將常用的html給輸出,甚至連php可以,真是超方便的,因此有在用Sublime Text的朋友,也一塊來看看吧!

Step1
首先,Sublime Text要先安裝好Emmet的外掛,接著再選擇 Preferences / Package Settings / Emmet / Settings-User選項。
梅問題-《Sublime Text》自訂Emmet常用的網頁標籤語法並快速輸出
Step2
接著就會開啟設定文件,且裡面空盪盪什麼也沒有。
梅問題-《Sublime Text》自訂Emmet常用的網頁標籤語法並快速輸出
Step3
再輸入下方的語法,在下方的語法可看到html,這表示要在html的模式下才能使用,接著在下方會看到aa與後方的html標籤語法,這代表當在html的模式下,輸入aa時就會產生aa方所設定的html 標籤語,同時需注意到,當html的標籤語法,也有用到「"」時,需在前面加「\」,當輸入完畢後,再將它儲存起來。
梅問題-《Sublime Text》自訂Emmet常用的網頁標籤語法並快速輸出
Step4
馬上來測試一下,由於剛所設定需在html的模式下才能使用,所以在新文件的右下角,點一下將它設定為HTML。
梅問題-《Sublime Text》自訂Emmet常用的網頁標籤語法並快速輸出
Step5
設定好後,在文件任意處,輸入剛所建立好的短碼「aa」。
梅問題-《Sublime Text》自訂Emmet常用的網頁標籤語法並快速輸出
Step6
接著再按Tab鍵,立即就會將剛的aa替換成,剛所設定的html標籤啦!是不是超方便的呀!
梅問題-《Sublime Text》自訂Emmet常用的網頁標籤語法並快速輸出
Step7
以下這些就是梅干所建立的常用標籤語法,而這邊可看到文件中出現紫色的字有,\、\n、\t這各代表什麼意呢?
1.\ :區隔"
2.\n :斷行
3.\t :向後空一格
梅問題-《Sublime Text》自訂Emmet常用的網頁標籤語法並快速輸出
Step8
比方輸入梅干剛所建立的html5,再按tab鍵立即就會產生出HTML5的網頁結構的語法啦!是不是超方便的呀!!也趕快動手作一下吧! 梅問題-《Sublime Text》自訂Emmet常用的網頁標籤語法並快速輸出

相關文章

Bootstrap滾動頁籤加入hash動態變換網址,更有助於SEO

Bootstrap滾動頁籤加入hash動態變換網址,更有助於SEO

「W3layouts」上千個免費可商用RWD自適應版型下載

「W3layouts」上千個免費可商用RWD自適應版型下載

Bootstrap教學-利用Bootstrap網格系統製作出flickr相片牆效果

Bootstrap教學-利用Bootstrap網格系統製作出flickr相片牆效果

Facebook Message臉書訊息網頁版,暗藏了許多經典的小遊戲

Facebook Message臉書訊息網頁版,暗藏了許多經典的小遊戲

加入微軟聯盟行銷!不但荷包賺飽飽,Office還可免費用

加入微軟聯盟行銷!不但荷包賺飽飽,Office還可免費用





回應本篇 »

(姓名)*必填
(信箱)*必填
(網站)

※PS: 因梅干時間有限,教學網中所分享的主題繁多(所遇狀況也很多),可能無法一一回答各位,不便之處還請見諒。
※PS: 本教學網不提供「破解檔」、「註冊機」或「註冊碼」等資訊,請勿利用留言索取檔案。

共 3 梅留言

  • 第3梅
    Quni 說道:

    梅干老師~~我有在你的範例裡面看到可以使用php
    但是如果我的值內有"$"符號,當我tab的時候,他就會變成"1″這個數字
    不曉得梅干老師有沒有遇到這個問題 TAT

    回應:
    到沒遇到這樣子的問題也
  • 第2梅
    G.M. 說道:

    請問
    指令部分可以讓我複製貼上嘛?

    回應:
    那個部分
  • 第1梅
    曾大樹 說道:

    應該不用自已新增那些設定,它原本的設定就有了?
    除非是要客制自已的快速鍵。

    回應:
    是的,它內建就有一些,但有些自已常用的,
    就可自己定義