Sublime Text2 新建文件快速生成Html頭部信息和炫酷的代碼補全

預備:安裝emmet插件(previously known as Zen Coding

 

方法一  package control法:

上一篇博客已經介紹瞭如何安裝package control。打開sublime,mac下用command + shift + p調出命令窗口,輸入install,選中package control:install package,等待1-2秒,下拉選中emmet plugin回車,等待2-3秒,重啓sublime。

方法二 手動安裝法:

git下emmet plugin,打開sublime,preferences,browse packages,將下載的zip文件解壓放到packages文件夾下,重啓sublime。

參見:官方安裝文檔  用命令 command + F 查找 install即可。

 

刪除已安裝插件:按ctr+shift +p然後輸入remove 回車,再輸入要刪除的插件名。

開始體驗:輸入以下簡寫,按tab鍵

html:5 

複製代碼
 1 <!doctype html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Document</title>
 6 </head>
 7 <body>
 8     
 9 </body>
10 </html>
複製代碼

html:4t

複製代碼
 1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
 2 <html lang="en">
 3 <head>
 4     <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
 5     <title>Document</title>
 6 </head>
 7 <body>
 8     
 9 </body>
10 </html>
複製代碼

html:4s

複製代碼
 1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
 2 <html lang="en">
 3 <head>
 4     <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
 5     <title>Document</title>
 6 </head>
 7 <body>
 8     
 9 </body>
10 </html>
複製代碼

html:xxs

複製代碼
 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
 2 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
 3 <head>
 4     <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
 5     <title>Document</title>
 6 </head>
 7 <body>
 8     
 9 </body>
10 </html>
複製代碼

ul#nav>li.itemS*4>a{Item $}

複製代碼
1     <ul id="nav">
2         <li class="itemS"><a href="">Item 1</a></li>
3         <li class="itemS"><a href="">Item 2</a></li>
4         <li class="itemS"><a href="">Item 3</a></li>
5         <li class="itemS"><a href="">Item 4</a></li>
6     </ul>
複製代碼
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章