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

相关推荐
1alisa8 小时前
Sublime Text for Mac v4【注册汉化版】代码编辑器
macos·编辑器·sublime text
神码编程9 小时前
【Unity】 HTFramework框架(六十四)SaveDataRuntime运行时保存组件参数、预制体
unity·编辑器·游戏引擎
mzak11 小时前
vscode集成deepseek实现辅助编程(银河麒麟系统)【详细自用版】
linux·vscode·编辑器·银河麒麟·deepseek
一个程序员(●—●)12 小时前
编辑器检视器面板深度扩展2+编辑器菜单栏扩展
编辑器
进阶的小木桩14 小时前
Visual Studio Code配置自动规范代码格式
ide·vscode·编辑器
归叶再无青16 小时前
Mark down编辑器
编辑器
修复bug17 小时前
trae.ai 编辑器:前端开发者的智能效率革命
人工智能·编辑器·aigc
Liudef0618 小时前
deepseek v3-0324 化学键线式Canvas编辑器设计
编辑器·deepseek
1024小神20 小时前
vscode/cursor编辑器中vue3文件里面的css不能注释解决办法
css·vscode·编辑器
2501_906801482 天前
BY组态-低代码web可视化组件
前端·物联网·低代码·数学建模·编辑器·web