二话不说，先看 Emmet LiveStyle 官方视频：

顺便吐槽下万恶的TC网络，为了下载官方被河蟹的视频，我搞了1个小时才把视频拉下来

官方网站地址 http://livestyle.emmet.io/

这边稍微介绍下安装方法：
首先，你需要使用 Sublime ，这个编辑器是一款非常强悍的编辑器，在编辑器里装上LiveStyle的扩展，安装方法：
按ctrl+shift+p，然后输入controll后选择Install Package，再在弹出的对话框里输出 LiveStyle 确定后即开始安装了，骚等几秒钟即可安装好，若再不会请google。

然后，给浏览器装上插件，Chrome直接在应用商店里即可安装，地址 https://chrome.google.com/webstore/detail/diebikgmpmeppiilkaijjbdgciafajmg

至此，就可以开始使用了。

我这里简单说下使用方法：
在需要调试的页面上打开“开发人员工具”，window下F12键，Mac下option+command+j键，打开后你会发现在原来的控制台最后多了一个LiveStyle的标签，切换到这个标签，然后勾选启用。

这时候你会看到它列出很多CSS喝对于给你选择的下拉框，注意，下拉框里列出的就是你Sublime开启的所有CSS的文件列表。
选择对应关系后（当然也可以自行添加）你就可以开始用它了，整个插件的使用还是很简单的，最关健的就是它是双向实时的，和控制台结合的也非常完美。