2.html编辑器介绍

html编辑器介绍

HTML 编辑器推荐

理论上我们可以使用记事本进行html编码和开发,但是在实际开发html页面的时候,使用一些专业的开发工具可以使我们更加快速和高效的进行开发,下面介绍几种开发工具:

你可以从以上软件的官网中下载对应的软件,按步骤安装即可。如果官网比较慢,也可以直接百度软件名称,网上会有很多安装包。

VsCode创建html

步骤 1: 新建 HTML 文件

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

复制代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>标题</title>
</head>
<body>
 
<h1>我的第一个标题</h1>
 
<p>我的第一个段落。</p>
 
</body>
</html>

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

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

安装插件

安装Prettier - Code formatter(代码格式化)、Live Server(本地开启服务和端口并打开页面)插件


视频演示:https://www.bilibili.com/video/BV19b2aYKEtt?vd_source=0f4eae2845bd3b24b877e4586ffda69a\&spm_id_from=333.788.videopod.sections

相关推荐
谢尔登4 小时前
【VSCode】修改侧边文件资源管理器中的文件夹折叠模式
ide·vscode·编辑器
bloglin999996 小时前
关闭VSCode 自动更新
ide·vscode·编辑器
向宇it8 小时前
【unity游戏开发——编辑器扩展】使用MenuItem自定义菜单栏拓展
开发语言·ui·unity·c#·编辑器·游戏引擎
谢尔登8 小时前
【VSCode】快捷键合集(持续更新~)
ide·vscode·编辑器
繁依Fanyi20 小时前
Animaster:一次由 CodeBuddy 主导的 CSS 动画编辑器诞生记
android·前端·css·编辑器·codebuddy首席试玩官
2301_803554521 天前
vim,gcc/g++,makefile,cmake
linux·编辑器·vim
ykjhr_3d1 天前
解锁课程编辑器之独特风姿
编辑器
threelab1 天前
12.three官方示例+编辑器+AI快速学习webgl_buffergeometry_indexed
学习·编辑器·webgl
MonkeyKing_sunyuhua1 天前
在 Visual Studio Code (VSCode) 中配置 MCP(Model Context Protocol)
ide·vscode·编辑器
小妖6662 天前
VScode 的插件本地更改后怎么生效
ide·vscode·编辑器