在线html代码可视编辑器（在线HTML编辑器快速转将内容为HTML原始码网页设着计利器）

记得以前刚开始接触网页制作时都是使用Microsoft FrontPage编辑器，也正因为有所见即得编辑器，才能让原本复杂难懂的HTML原始码变得更简单易懂，它将原始码转换成可视化内容，只要直接输入文字、图片、超连接后修改样式即可将网页制作出来，当然这些页面背后仍是有所谓的HTML代码存在，只在需要时才会切换原始码模式。

我后来还是很习惯通过所见即所得（What You See Is What You Get，缩写WYSIWYG）编辑器写文章，WordPress内置文章编辑功能就是此形式，有时候遇到要编辑网页也会使用这个工具来产生HTML代码，毕竟以看得到的方式编辑比较容易得到自己需要的东西，大概就是这么一回事。

现在网页编辑器已没有像十几年前那么盛行了，可能很多人的电脑里早已没有类似的应用程序，如果你还是需要这功能，HTML Editor或许可以应急，这是一款在线免费HTML可视化编辑器，直接打开浏览器就能使用，它就像一般的网页编辑器，使用者可以直接在编辑器里建立图文内容，HTML Editor会在另一画面显示HTML原始码，编辑时就能直接取得对应的原始码以便使用于博客文章或网页制作。

这功能看起来虽然好像微不足道，事实上当你需要时就会非常方便，HTML Editor不限于Windows或Mac使用，而且更重要的是不用额外下载安装软件；对于不熟悉HTML编写的使用者来说，它也能快速制作出带有样式的原始码，尤其是拿来撰写网页表格，直接使用可视化编辑器会更简单。

站点名称：HTML Editor

网站连接：https://htmleditor.io/

使用教学

STEP 1

开启HTML Editor网站后，画面被切割成左右两个部分，左边为所见即所得编辑器，右边是显示原始码的字段，一开始已经有示例内容，可以看到编辑器里样式文字已经被转为我们熟悉的HTML程序码并显示于网站右侧。

STEP 2

使用方法很简单，我就不通盘介绍所有编辑器的功能，大致上比较会用到的例如格式，可以调整H1、H2、H3等不同层级的标题，亦能加入粗体、斜体、项目符号、缩排或设定对齐方向等等，其它例如插入超连接、图片或视频也都能从编辑器上方的功能按钮来做到。

我认为HTML Editor最方便的是可以拿来做网页表格，从「Table」以鼠标光标快速设定要多少字段，即可在编辑器里插入表格，同时设定每个字段要显示那些内容。如果要直接以代码来撰写表格可能稍嫌复杂，以所见即所得编辑器会简单许多。

STEP 3

当你一边在使用编辑器时，右侧就会同步显示对应的HTML代码，跟早期网页编辑器功能差不多，最后直接复制代码，就能将它复制、使用到其它地方，可以说非常好用！也不用再因为需要产生原始码而去找网页编辑器，从浏览器开启HTML Editor即可。