菜鸟笔记

Menu

Emmet LiveStyle – Sublime text 2/3 配合谷歌 Chrome 浏览器实现高效可视化开发

Emmet LiveStyle 是一个配合 Sublime text 使用的谷歌浏览器插件,它是一个可以实现 [编辑器↔浏览器] 实时双向预览编辑的新一代 CSS 编辑器,目前只能够在 Chrome 和 Sublime Text 使用,以后应该会支持更多的浏览器跟编辑器的。

LiveStyle 功能

在 Chrome 中安装 LiveStyle 插件

在 Chrome 应用商店搜索 LiveStyle 或者直接打开https://chrome.google.com/webstore/detail/emmet-livestyle/diebikgmpmeppiilkaijjbdgciafajmg?utm_source=chrome-ntp-icon,安装完后重启浏览器。

livestyle

再打开时,按F12打开开发者工具你会发现多了一个 LiveStyle 的选项卡:

 

livestyle2

当然,这个是需要在 Sublime Text 里面安装 LiveStyle 这个插件才能启用的。

在Sublime Text 编辑器里面安装 LiveStyle 插件

要在 Sublime Text 里面安装插件,你肯定需要这个 Package Control,有它在,安装插件就将变得非常方便。

安装 Package Control 后你只需要按 Crtl+Shift+p 输入 packi 回车搜索 LiveStyle 就能快捷的安装这个插件了。

一切就绪后,快去享受高效的实时CSS编辑的快感吧!

相关下载

Sublime Text 3 中文破解版

— 于 共写了830个字
— 文内使用到的标签:

14条回应:“Emmet LiveStyle – Sublime text 2/3 配合谷歌 Chrome 浏览器实现高效可视化开发”

  1. 馒头饭madfan说道:

    Chrome的内存占用是个老问题。。

  2. 南寻说道:

    Chrome用不惯。。

  3. 番茄说道:

    真心感谢分享

  4. 嗯?说道:

    Adobe 有个开源的Brackets其实才是真正前端开发的神器,chrome可视化开发集成在里面了,强烈推荐!

  5. 在这里学到了不少东西 支持一个

  6. 全球骗术说道:

    博主,您好,茫茫互联网的海洋中,你我的相遇已是缘分,希望今后我们可以经常来往,每一次留言,都是我对您最真挚的祝福,希望您可以过的快乐、幸福!我会一直为你默默加油!
    我的博客:http://www.yibut.com ,期待您的光临!

发表评论

电子邮件地址不会被公开。 必填项已用*标注