沐鸣娱乐


        用html代码编写的免费软件下载和安装教程(用html代码编写的免费软件下载和安装教程)

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

        基于html项目的开发和代码编写现在网上有很多编辑器,也有免费的 ,也有收费的编辑器 。基于在Windows系统环境下开发和编写html代码最简单的编辑器就是Windows自带的记事本 ,我们可以使用记事本编辑html代码。

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

        虽然记事本也能编写html代码 ,但是效率不高也不方便,所以我们使用专业的编辑器来开发项目,编写代码和管理项目。

        常用html代码编写的免费软件有HBuilderX,vs code ,Sublime Text 等等 。

        HBuilderX官网下载地址:

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

        vs code的官网下载地址:

        https://code.visualstudio.com/

        Sublime Text官网下载地址:

        https://www.sublimetext.com/

        我们以后的教程都使用HBuilderX ,所以下面为了同学们的学习方便,对HBuilderX的下载和安装做详细的教程 。

        一,下载

        首先访问HBuilderX的官网网址:

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

        用html代码编写的免费软件下载和安装教程(用html代码编写的免费软件下载和安装教程)

        打开上面的HBuilderX下载网址后点击页面上download,在弹出的对话框里选择适合自己电脑的HBuilderX版本下载。

        用html代码编写的免费软件下载和安装教程(用html代码编写的免费软件下载和安装教程)

        在Windows10环境下下载后的文件是一个压缩的.zip文件。

        用html代码编写的免费软件下载和安装教程(用html代码编写的免费软件下载和安装教程)


        二,安装

        鼠标右击下载下来的压缩文件进行解压。

        用html代码编写的免费软件下载和安装教程(用html代码编写的免费软件下载和安装教程)

        解压完成后是一个名为HBuilderX的文件夹。

        用html代码编写的免费软件下载和安装教程(用html代码编写的免费软件下载和安装教程)

        解压完成后鼠标双击HBuilderX文件夹 :

        用html代码编写的免费软件下载和安装教程(用html代码编写的免费软件下载和安装教程)

        双击运行名为HBuilderX.exe的应用程序文件即可启动HBuilderX编辑器 :

        用html代码编写的免费软件下载和安装教程(用html代码编写的免费软件下载和安装教程)

        因为HBuilderX是一个绿色软件所以没有桌面快捷方式和开始菜单快速启动程序 ,我们可以右击HBuilderX.exe文件创建桌面快捷方式。

        用html代码编写的免费软件下载和安装教程(用html代码编写的免费软件下载和安装教程)


        小百科:

        绿色软件指一类小型软件 ,多数为免费软件,最大特点是软件无需安装便可使用,可存放于闪存中 ,移除后也不会将任何记录留在本机计算机上 。通俗点讲绿色软件就是指不用安装 ,下载直接可以使用的软件 。绿色软件不会在注册表中留下注册表键值,所以相对一般的软件来说,绿色软件对系统的影响几乎没有 ,所以是很好的一种软件类型。


        三 ,新建项目

        HBuilderX编辑器初次启动时的默认界面是下图所示:

        用html代码编写的免费软件下载和安装教程(用html代码编写的免费软件下载和安装教程)

        按照下图所示可以创建一个新的名为demo1空白项目:

        用html代码编写的免费软件下载和安装教程(用html代码编写的免费软件下载和安装教程)用html代码编写的免费软件下载和安装教程(用html代码编写的免费软件下载和安装教程)

        名为demo1的空白项目创建成功后的界面如下图所示:

        用html代码编写的免费软件下载和安装教程(用html代码编写的免费软件下载和安装教程)

        接下来在刚我们新建的demo1项目下创建名为helloworld的html文件

        鼠标右击创建的demo1项目选择新建在选择.html文件:

        用html代码编写的免费软件下载和安装教程(用html代码编写的免费软件下载和安装教程)

        在弹出的对话框里填入html文件的名称 :

        用html代码编写的免费软件下载和安装教程(用html代码编写的免费软件下载和安装教程)用html代码编写的免费软件下载和安装教程(用html代码编写的免费软件下载和安装教程)

        编写一段代码:

        用html代码编写的免费软件下载和安装教程(用html代码编写的免费软件下载和安装教程)

        运行 :

        用html代码编写的免费软件下载和安装教程(用html代码编写的免费软件下载和安装教程)

        在浏览器上观察效果:

        用html代码编写的免费软件下载和安装教程(用html代码编写的免费软件下载和安装教程)


        好了,到这里html的开发环境搭建和HBuilderX的安装教程结束了。

        下面再给大家教一下怎样修改HBuilderX的主题风格 ,HBuilderX自身提供了修改软件主题的功能,使用者可以自身需求和喜好修改HBuilderX的风格。在喜欢自己喜欢的环境下做开发也是令人羡慕的一件事 。

        按照一下步骤可以修改HBuilderX的主题 ,默认主题是绿柔 ,我们可以改成雅黑 ,雅蓝或者自定义主题:

        用html代码编写的免费软件下载和安装教程(用html代码编写的免费软件下载和安装教程)

        雅黑主题 :

        用html代码编写的免费软件下载和安装教程(用html代码编写的免费软件下载和安装教程)

        雅蓝主题:

        用html代码编写的免费软件下载和安装教程(用html代码编写的免费软件下载和安装教程)

        好了本节全部内容全部结束了 ,希望我准备的内容对你有所帮助

        你的支持是我的最大动力,若觉得我的教程还可以对你有帮助为我点赞加关注 !谢谢!

        相关新闻

        联系我们
        联系我们
        分享本页
        返回顶部

          XML地图