首頁 > 開發者 > Sublime Text
標籤：print mkdir sublime urllib 資源管理 爬蟲 批量替換 item url
1、輸入“!”或“html:5”，然後按Tab鍵：
html:5 或!：用於HTML5文件類型
html:xt：用於XHTML過渡文件類型
html:4s：用於HTML4嚴格文件類型
2、輕鬆添加類、id、文本和屬性p#foo 補充ID
p.foo 補充類
h1{foo} 和 a[href=#] 為h1和a標籤
>：子項目符號，表示嵌套的元素
+：同級標籤符號
^：可以使該符號前的標籤提升功能一行
效果如所示：
嵌套寫法
4、分組
(.foo>h1)+(.bar>h2)
產生：
<div class="foo"> <h1></h1> </div> <div class="bar"> <h2></h2> </div>
分組寫法
5、定義多個元素 *
ul>li*3
定義多個元素
6、定義多個帶屬性的元素
ul>li.item$*3 $代表尾數不同1、2、3
定義多個帶屬性
7、Css快捷
1）w100 =》 width: 100px;
2）p 表示%
e 表示 em x 表示 exh10p+m5e =》 height: 10%; margin: 5em;
3）@f
@font-face {
font-family:;
src:url();
}
4）模糊比對
ov:h、ov-h、ovh和oh
模糊比對
5）供應商首碼
如果輸入非W3C標準的CSS屬性，Emmet會自動加上供應商首碼，比如輸入trs，則會產生：
-webkit-transform: ; -moz-transform: ; -ms-transform: ; -o-transform: ; transform: ;
快速產生首碼
你也可以在任意屬性前加上“-”符號，也可以為該屬性加上首碼。比如輸入-super-foo：
-webkit-super-foo: ; -moz-super-foo: ; -ms-super-foo: ; -o-super-foo: ; super-foo: ;如果不希望加上所有首碼，可以使用縮寫來指定，比如-wm-trf表示只加上-webkit和-moz首碼：
-webkit-transform: ; -moz-transform: ; transform: ;首碼縮寫如下：
w 表示 -webkit-
m 表示 -moz-
s 表示 -ms-
o 表示 -o-
6）漸層
輸入lg(left, #fff 50%, #000)
漸層快捷產生
7）其他參考
http://devework.com/emmets-css.html
https://www.douban.com/note/299285545/?qq-pf-to=pcqq.c2c
1）c+s+p
2）pcic
3）輸入sublimeCodeIntel
雖然PostCSS才是未來，但是Sass成熟穩定，擁有一大波忠實的使用者，及開源項目，且最近Bootstrap 4 alpha也從Less轉到Sass了。所以瞭解Sass還是非常有必要的。
基於快速開發及效率，我開發環節習慣通過編輯器外掛程式來完成Less/Sass編譯，這樣可以快速定位、修複Bug。
下面介紹一款Sublime Text的外掛程式SASS build system for Sublime Text 2可以在編輯器完成Sass編譯。名字是2但Sublime Text 3可用無壓力。
安裝Sass
首先要安裝Ruby和Sass，詳細可參考：http://www.w3cplus.com/sassguide/install.html 或者網上大把教程，安裝Sass的時候可能被牆不一定安裝得上，所以可以退而求其次安裝測試本版--pre。
Sublime Text安裝Sass Build外掛程式
1）安裝 Package Control Plugin
開啟：View > Show Console
輸入：
Sublime Text2
import urllib2,os,hashlib; h = ‘eb2297e1a458f27d836c04bb0cbaf282‘ + ‘d0e7a3098092775ccb37ca9d6b2e4b7d‘; pf = ‘Package Control.sublime-package‘; ipp = sublime.installed_packages_path(); os.makedirs( ipp ) if not os.path.exists(ipp) else None; urllib2.install_opener( urllib2.build_opener( urllib2.ProxyHandler()) ); by = urllib2.urlopen( ‘http://packagecontrol.io/‘ + pf.replace(‘ ‘, ‘%20‘)).read(); dh = hashlib.sha256(by).hexdigest(); open( os.path.join( ipp, pf), ‘wb‘ ).write(by) if dh == h else None; print(‘Error validating download (got %s instead of %s), please try manual install‘ % (dh, h) if dh != h else ‘Please restart Sublime Text to finish installation‘)Sublime Text3
import urllib.request,os,hashlib; h = ‘eb2297e1a458f27d836c04bb0cbaf282‘ + ‘d0e7a3098092775ccb37ca9d6b2e4b7d‘; pf = ‘Package Control.sublime-package‘; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); by = urllib.request.urlopen( ‘http://packagecontrol.io/‘ + pf.replace(‘ ‘, ‘%20‘)).read(); dh = hashlib.sha256(by).hexdigest(); print(‘Error validating download (got %s instead of %s), please try manual install‘ % (dh, h)) if dh != h else open(os.path.join( ipp, pf), ‘wb‘ ).write(by)詳見：https://packagecontrol.io/installation#st3
2）安裝 Package Control Plugin
Ctrl+Shift+P (Linux/Windows) 或 Command+Shift+P (OS X)，然後輸入‘install‘會看到Package Control: Install Package並選擇。
等待列表出來，輸入Sass會看到SASS Build System選擇安裝。
安裝完成後，Ctrl+B (Linux/Windows) or Command+B (OS X)可編譯Sass為CSS，還會有一個.map檔案。
更多詳細見官方：https://github.com/jaumefontal/SASS-Build-SublimeText2
10、安裝多行注釋外掛程式使用package control安裝DocBlockr。安裝完成後使用方法如下：
A、先寫完你的函數
function testFunction(a, b, c) {}B、然後在函數的前面一行，輸入
/**C、然後斷行符號，自動產生
/** * [testFunction description] * @param {[type]} a [description] * @param {[type]} b [description] * @param {[type]} c [description] * @return {[type]} [description] */function testFunction(a, b, c) {}1) 選擇
以下是一些Sublime Text選擇文本的快速鍵：
Sublime Text還支援一次選中多行的操作：Furthermore, Sublime Text brings lets us select multiple lines at once, which can significantly boost your productivity. There are several ways to perform this feature:
選擇的快速鍵
2) CSS排序
CSS屬性的順序一般不重要，因為無論何種順序瀏覽器都能正確渲染。但排序所有的屬性還是有助於代碼的整潔。在Sublime Text中，選中CSS屬性後按F5就可以按字母順序排序。
CSS排序
也可以使用 CSSComb 等第三方外掛程式，更詳細的控制排序的方法。
3) 命令選擇區（Command Palette）
使用命令選擇區可以快速完成多重任務。按Command + Shift + P調出面板，鍵入需要的命令即可。看以下的幾個樣本：
▼ 重新命名檔案
重新命名檔案
▼ 設定檔案為HTML文法
HTML文法
▼ 插入程式碼片段
插入程式碼片段
4) 切換標籤頁與工程
在同時開啟多個標籤頁時，可以用以下的熱鍵切換：
5) 跨檔案編輯
同一個編輯操作可以在多個檔案中同時重複。舉個例子，多個檔案中有同一段代碼時，可用以下的步驟快速編輯：
跨檔案編輯
6) 檔案爬蟲
按Command + R可以列出文檔中所有的CSS選取器。可以選擇並立刻跳轉查看。這個操作比使用一般的“尋找”功能快得多。
檔案爬蟲
7) 拼字檢查
如果你經常使用Sublime Text從事英文創作，那麼啟用拼字檢查就非常有用處了。選擇Preferences > Settings – User菜單，添加以下代碼：
"spell_check": true,8) 增強側邊欄
SideBarEnhancements外掛程式有效地改進了Sublime的側邊欄。安裝外掛程式後在側邊欄上點擊右鍵，可以找到一下新功能：在資源管理員中開啟、建立檔案、建立檔案夾、以…開啟、在瀏覽器中開啟。
增強側邊欄
註：在瀏覽器中開啟的熱鍵是F12。
9) 更換主題
Sublime Text的外觀主題可以更換。Soda Theme就是一個不錯的主題，可以在包管理器中安裝。
更換主題
如果要安裝的主題並不在線上軟體倉庫中，也可以手動安裝：
10) 更換Sublime Text程式表徵圖
不僅主題可以更換，表徵圖也可以。在Dribbble上有大量重新設計的Sublime Text精美表徵圖。更換方法：
更換表徵圖
11) 同步選項
如果在多台電腦上工作，同步選項設定應該是一個好主意。我們借用Dropbox完成這一任務。
首先在終端中運行以下命令上傳設定檔案：
mkdir $HOME/Dropbox/sublime-text-3/ mv "$HOME/Library/Application Support/Sublime Text 3/Packages" "$HOME/Dropbox/sublime-text-3/" mv "$HOME/Library/Application Support/Sublime Text 3/Installed Packages" "$HOME/Dropbox/sublime-text-3/"然後在所有需要同步的電腦上運行以下命令下載設定：
DSTPATH="$HOME/Library/Application Support/Sublime Text 3" DROPBOX_PATH="$HOME/Dropbox/sublime-text-3" rm -rf "$DSTPATH/Installed Packages" rm -rf "$DSTPATH/Packages" mkdir -p "$DSTPATH" ln -s "$DROPBOX_PATH/Packages" "$DSTPATH/Packages" ln -s "$DROPBOX_PATH/Installed Packages" "$DSTPATH/Installed Packages"12) 可點擊的URL
使用小外掛程式ClickableURLs可以讓檔案中的URL能夠點擊。
Sublime常見操作
下面還有一些在看過駭客新聞評論後的補充：
選擇類
編輯類
搜尋類
顯示類
sublime常用的外掛程式：
參考：
http://blog.jobbole.com/88648/
1190000000505218
Sublime Text 你所不知道的12個秘密
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
