1. Adobe公司的Brackets

用于初学者最合适

下载地址：http://brackets.io/

好用的插件：

Eemmet 代码快捷键

Brackets Vue 支持vue文件

Brackets Tree Icons 文件图标和文件关系线

indent Guides 代码缩进线 （启用该功能在‘菜单栏’下的‘视图’里）

Autosave Files on Window Blur 离开编辑器后自动保存

2. 微软的Visual Studio Code

用于参加工作了的人最合适

下载地址： https://code.visualstudio.com/

好用的插件：

Color Info 供你在 CSS 中使用颜色的相关信息。你只需在颜色上悬停光标，就可以预览色块中色彩模型的（HEX、RGB、HSL 和 CMYK）相关信息了

Code Runner 能够运行多种语言的代码片段或代码文件：C，C++，Java，JavaScript，PHP，Python，Perl，Ruby，Go等等安装完成后，右上角会出现：?

Image Preview 鼠标移到路径里显示图像预览

Icon Fonts 这是一个能够在项目中添加图标字体的插件。该插件支持超过 20 个热门的图标集，包括了 Font Awesome、Ionicons、Glyphicons 和 Material Design Icons。

Auto Rename Tag 修改html标签，当你在修改头标签时，尾标签也自动修改。

vscode-database 连接数据库,有时候，实在不想开phpMyAdmin或者Navicat，只想简单连接下测试下增删改查，不想去切换操作，那么有了这个插件就省力了。

IntelliSense for CSS class names in HTML 基于你的项目以及通过link标签引用的外部文件，该智能插件提供 HTML 中 CSS class 名字的补全。

vscode-background 自定义编辑器的背景，可插入图片

Bracket Pair Colorizer 对应的括号使用不同的颜色显示，方便视觉落差

CSS Peek 在html中查看css样式,跳转到指定css样式

Highlight Line 编辑的当前行，显示下划线

看图片吧：

3. sublime

我是用于多代码参照对比，临时打开查看用的

下载地址： http://www.sublimetext.com/

安装插件的方法：https://blog.csdn.net/qq_42618566/article/details/100604653

好用的插件：

Emmet（原名 Zen Coding）：一种快速编写html/css的方法

html5：支持hmtl5规范的插件包

jQuery：支持JQuery规范的插件包

javascript-API-Completions：支持Javascript、JQuery、Twitter Bootstrap框架、HTML5标签属性提示的插件，是少数支持sublime text 3的后缀提示的插件，HTML5标签提示sublime text 3自带，不过JQuery提示还是很有用处的，也可设置要提示的语言。

JSFormat：JS代码格式化插件。

SublimeLinter：一个支持lint语法的插件，可以高亮linter认为有错误的代码行，也支持高亮一些特别的注释，比如“TODO”，这样就可以被快速定位。（IntelliJ IDEA的TODO功能很赞，这个插件虽然比不上，但是也够用了吧）

BracketHighlighter：类似于代码匹配，可以匹配括号，引号等符号内的范围。

Alignment：代码对齐，如写几个变量，选中这几行，Ctrl+Alt+A，哇，齐了。

Ctags：函数跳转，我的电脑上是Alt+点击 函数名称，会跳转到相应的函数

Doc​Blockr：注释插件，生成幽美的注释。标准的注释，包括函数名、参数、返回值等，并以多行显示，省去手动编写。

SideBarEnhancements