LiveStyle是Chrome中提高開發效率的一款CSS編輯器插件。利用LiveStyle和Sublime Text編輯器（經測試ST2 ST3均可以支持）結合可實現可視化開發，一次配置，簡單易用！ LiveStyle官方網站：http://livestyle.emmet.io/ LiveStyle和Sublime Text配置說明
一、安裝並啟動Chrome瀏覽器，進入Chrome APP站點：https://chrome.google.com/webstore/category/apps 搜索：LiveStyle可以看到下圖並點擊安裝啟用
二、下載Sublime Text編輯器
下載編輯器並安裝Emmet LiveStyle插件
當然，Emmet（即之前的zendcoding）這個這么好用的插件也是必裝的
關於安裝就不再多說了 st2可以看http://www.cnblogs.com/cuoreqzt/archive/2013/01/07/2848975.html
三、用Chrome打開需要編輯的地址，右鍵點擊查看網頁元素,可看到下圖。
四、打開已經安裝好的Sublime Text3，到Chrome里查看已經自動掛接上Sublime了。（顯示的是當前st的版本 如果是2就顯示st2 3就顯示st3，顯示no active editor的話。。。。你應該先安裝st並打開。。。）
在sublime Text 中打開一個 css 文檔。回到瀏覽器查看並設置同步
此時在Chrome代碼查看器中編輯您的CSS，即可同步到您在Sublime Text中打開的CSS文件中。
或者在Sublime Text中編輯您的CSS也可義在瀏覽器中同步顯示頁面效果！這並不需要保存，只要修改就可以立刻看到效果，比F5軟件好用多了。。。（其實我是因為沒錢買F5，又忍受不了F5隔一會的“溫馨提示”。。⊙﹏⊙b汗）