HTML 编辑器


可以使用专业的 HTML 编辑器来编辑 HTML,菜鸟教程为大家推荐几款常用的编辑器:

你可以从以上软件的官网中下载对应的软件,按步骤安装即可。

接下来我们将为大家演示如何使用 VS Code 工具来创建 HTML 文件。


VS Code

Visual Studio Code(简称 VS Code)是一个由微软开发,同时支持 Windows 、 Linux 和 macOS 等操作系统且开放源代码的代码编辑器,编辑器中内置了扩展程序管理的功能。

VS Code 安装教程参考:https://www.runoob.com/w3cnote/vscode-tutorial.html

步骤 1: 新建 HTML 文件

在 VS Code 安装完成后,选择 文件(F)->新建文件(N) ,在新建的文件中输入以下代码:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>AY论坛(readme.com)</title>
</head>
<body>

<h1>我的第一个标题</h1>

<p>我的第一个段落。</p>

</body>
</html>

HTML 编辑器

步骤 2: 另存为 HTML 文件

然后选择 文件(F)->另存为(A) ,文件名为 runoob.html:

HTML 编辑器

当您保存 HTML 文件时,既可以使用 .htm 也可以使用 .html 扩展名。两者没有区别,完全根据您的喜好,我建议统一用 .html。

在一个容易记忆的文件夹中保存这个文件,比如 runoob

步骤 3: 在浏览器中运行这个 HTML 文件

然后鼠标右击编辑器上的文件名,选择在默认浏览器打开(也可以其他的浏览器):

注:vscode 中使用浏览器打开 html 文件需要 安装 open in browser 扩展。

VS Code 和 Sublime Text 还可以配合 Emmet 插件来提高编码速度。

若文章对你有帮助,可以点赞或打赏支持我们。发布者:lyh会员,转载请注明出处:http://61.174.243.28:13541/AY-knowledg-hub/html-%e7%bc%96%e8%be%91%e5%99%a8/

(0)
lyhlyh会员认证作者
上一篇 2023年 4月 10日 下午10:13
下一篇 2023年 4月 11日 下午6:54

相关推荐

  • tracepath

    文章目录tracepath补充说明语法参数实例 tracepath 追踪目的主机经过的路由信息 补充说明 tracepath命令 用来追踪并显示报文到达目的主机所经过的路由信息。 …

    入门教程 2024年 3月 11日
  • 解决WARNING: REMOTE HOST IDENTIFICATION HAS CHANGED!

    远程连接ssh服务器时,若服务器系统发生了改变,旧的鉴权无法生效时,在登陆时会提示以下问题。 WARNING: REMOTE HOST IDENTIFICATION HAS CHA…

    2021年 7月 13日
  • locate

    文章目录locate补充说明语法选项实例 locate 比 find 好用的文件查找工具 补充说明 locate 让使用者可以很快速的搜寻档案系统内是否有指定的档案。其方法是先建立…

    入门教程 2023年 12月 19日
  • IOS加速度传感器(accelerometer)

    文章目录简介实例步骤输出 简介 加速度传感器是根据x、y和z三个方向来检测在设备位置的改变。 通过加速度传感器可以知道当前设备相对于地面的位置。 以下实例代码需要在真实设备上运行,…

    2023年 3月 30日
  • firewall-cmd

    文章目录firewall-cmd补充说明选项实例 firewall-cmd Linux上新用的防火墙软件,跟iptables差不多的工具 补充说明 firewall-cmd 是 f…

    入门教程 2023年 12月 14日
  • fsck

    文章目录fsck补充说明语法选项参数实例 fsck fsck(英文全拼:file system check)命令检查并且试图修复文件系统中的错误 补充说明 fsck命令 被用于检查…

    入门教程 2023年 12月 14日
  • ldconfig

    文章目录ldconfig补充说明语法选项 ldconfig 动态链接库管理命令 补充说明 ldconfig命令 的用途主要是在默认搜寻目录/lib和/usr/lib以及动态库配置文…

    入门教程 2023年 12月 19日
  • Hello World

    文章目录Hello World搭建Go工作空间运行 Go 程序1、使用 go run 命令。在命令提示符中输入以下命令2、使用 go install 命令。在命令提示符中输入以下命…

    2023年 12月 5日
  • vgremove

    文章目录vgremove补充说明语法选项参数实例 vgremove 用于用户删除LVM卷组 补充说明 vgremove命令 用于用户删除LVM卷组。当要删除的卷组上已经创建了逻辑卷…

    入门教程 2024年 3月 11日
  • vdfuse

    文章目录vdfuse补充说明什么是VirtualBox语法选项实例 vdfuse VirtualBox软件挂载VDI分区文件工具 补充说明 vdfuse命令 是VirtualBox…

    入门教程 2024年 3月 11日
Translate »