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>

 

更多炫酷信息和emmet語法請參見:

      

 

 

 

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM