html编辑器app_web前端HTML教程——开发环境搭建下载和安装编辑器

HTML开发环境搭建

有了好的编辑器，我们就可以很方便的开发项目，编写代码，配置和管理我们的项目。所以在开始编写 HTML 代码之前，我们需要先搭建一个开发环境。

网上有很多用于HTML项目开发和代码编写的编辑器，有免费的，也有付费的。系统环境中最简单的用于HTML代码开发和编写的编辑器就是系统自带的记事本，我们可以使用它来编辑HTML代码。

使用记事本编写HTML的步骤是，首先新建一个文本文档，按照HTML的语法规则编写相关代码并保存文件，然后将文件扩展名改为.html，用电脑上的浏览器打开就可以查看我们代码的运行结果了。

记事本虽然也可以编写HTML代码，但是不够高效和方便，所以我们还是要使用专业的编辑器来开发项目、编写代码和管理项目。

常用的编写HTML代码的免费软件有vs code，Text等。

官网下载地址：

https://www.dcloud.io/hbuilderx.html

VS code官网下载地址：

https://code.visualstudio.com/

文本官网下载地址：

http://www.sublimetext.com/

我们将在以后的所有教程中使用它，因此为了方便学生的学习，我们将提供有关其下载和安装的详细教程。

1. 下载

首先访问官方网站：

https://www.dcloud.io/hbuilderx.html

打开上面的下载网址之后，点击页面，在弹出的对话框中选择适合自己电脑的版本进行下载。

环境中下载的文件是一个压缩的.zip文件。

2.安装

右键单击下载的压缩文件，进行解压。

解压完成后里面有一个名为的文件夹。

解压完成后，双击文件夹：

双击.exe应用程序文件启动编辑器：

由于它是绿色软件，所以没有桌面快捷方式和开始菜单快速启动程序，我们可以右键点击.exe文件来创建桌面快捷方式。

小百科：

绿色软件是指一类小型软件，其中大部分都是免费软件。最大的特点就是软件无需安装即可使用，可以存放在闪存中，删除后不会在本地计算机留下任何记录。通俗的讲，绿色软件就是指下载后不需要安装就可以直接使用的软件。绿色软件不会在注册表中留下注册表键值，所以相对于一般的软件来说，绿色软件对系统几乎没有影响，所以是一类非常优秀的软件。

3. 新建项目

编辑器首次启动时的默认界面如下图：

您可以创建一个名为demo1的新空白项目，如下所示：

成功创建一个名为demo1的空白项目后的界面如下所示：

接下来在我们刚刚创建的demo1项目中创建一个名为

右键点击创建的demo1项目，选择新建，然后选择.html文件：

在弹出的对话框中填入HTML文件的名称：

写一段代码：

跑步：

观察浏览器上的效果：

好了，HTML开发环境的设置和安装教程到此结束。

接下来教大家如何修改主题风格，提供了修改软件主题的功能，用户可以根据自己的需求和喜好来修改风格，在自己喜欢的环境中做开发也是一件很让人羡慕的事情。

按照以下步骤修改主题。默认主题为 Green Soft，可以更改为 Black、 Blue 或自定义主题：

弥黑主题：

典雅蓝色主题：

好了，这一节就结束了。希望我准备的内容对你们有帮助。

你们的支持就是我最大的动力，如果觉得我的教程不错或者对你有帮助的话，请点赞关注我吧！谢谢！